Fancybox infinite loop - Cannot read property 'href' of undefined

问题

I'm trying to add a lightbox via fancybox behavior to my site, but inspecting with a JS profiler after clicking on the image to be lightboxed with FF or Chrome, I get into an infinite loop with this error:

Cannot read property 'href' of undefined

Images are however loaded, although with bugs when closing or with crashing the browser sometimes, but the infinite number of these calls and recreating the images in the HTML source code causes this to happen.

This is my HTML with images:

<div class="below_shadow" style="top: 0px;">
    <a class="portfolio_link" href="http://mywebsite.com/images/DSC_0258-794x1024.jpg">
    <img class="frame" alt="" src="http://mywebsite.com/images/DSC_0258-794x1024.jpg&amp;h=131&amp;w=180&amp;zc=1" style="top: 0px;">
    </a>
    <span style="display: none;" class="portfolio4_hover">
        <a style="top: 0px; " class="portfolio_image" href="javascript:;">
            <img alt="" src="http://mywebsite.com/images/icon_zoom.png">
        </a>
    </span>
</div>

And this is my call in the JS section:

jQuery(window).load(function() {
jQuery('.below_shadow a.portfolio_link').fancybox({ 
    padding: 0,
    overlayColor: '#000', 
    transitionIn: 'elastic',
    transitionOut: 'elastic', 
    overlayOpacity: .8,
    showNavArrows: true
});
});

回答1:

The Fancybox plugin has a bug with synchronization or calling image resources. When image is clicked, the transparent div loads the big image + the title. Under some unknown circumstances the title is not always loaded and this causes a bug in the system.

Even if your anchors and images do have the "title" attribute, there seems to be some fancybox bug leading to this inner loop and leak by not passing the title argument properly.

回答2:

I found out the error - the infinite loop is called when this code is evaluated:

jQuery(this).find('.portfolio4_hover').show();

Honestly - dunno why, but this is the case. If I comment this line (and it's hide line below), everything works correctly.

来源：https://stackoverflow.com/questions/5844262/fancybox-infinite-loop-cannot-read-property-href-of-undefined

标签

jquery

fancybox