lightbox-0.5 jquery兼容性问题

时间:2011-11-22 20:14:01

标签: jquery lightbox compatibility

我正在尝试从这里集成jquery灯箱插件:http://leandrovieira.com/projects/jquery/lightbox/

它正在运行,但仅适用于jquery 1.2.3

当灯箱关闭并第二次启动时,即下一个和上一个链接不能正确循环播放照片,

如果我点击下一个链接,照片的顺序就会开始跳跃,而不是逐个浏览照片,点击它会转到1,3,5等等

<顺便说一下,这个问题只有在我尝试使用键盘箭头导航时才会发生,如果我使用鼠标然后它很好,但只能用键盘

很奇怪,因为我试图解压缩原始提供的示例文件,我只是将jquery版本替换为新版本,这就是我发现这个问题的时候,

我所做的就是将jquery版本从1.2.3更改为任何更新版本,这是问题开始的时候

我试图在Internet Explorer,firefox,chrome,safari甚至在不同的计算机上运行相同的html,但仍然存在同样的问题

2 个答案:

答案 0 :(得分:2)

您可以在网上发布问题页面的链接吗?

此外,您可以尝试将Lightbox换成Slimbox2 - 它具有几乎相同的用户界面,但可以直接解决错误。

答案 1 :(得分:0)

我用这种方式解决了问题:在方法_set_image_to_view()中,在行之间添加行_disable_keyboard_navigation(); _resize_container_image_box(objImagePreloader.width,objImagePreloader.height);

objImagePreloader.onload=function(){};

因此整个方法如下:

function _set_image_to_view() { // show the loading
        // Show the loading
        $('#lightbox-loading').show();
        if ( settings.fixedNavigation ) {
            $('#lightbox-image,#lightbox-container-image-data-box,#lightbox-image-details-currentNumber').hide();
        } else {
            // Hide some elements
            $('#lightbox-image,#lightbox-nav,#lightbox-nav-btnPrev,#lightbox-nav-btnNext,#lightbox-container-image-data-box,#lightbox-image-details-currentNumber').hide();
        }
        // Image preload process
        var objImagePreloader = new Image();
        objImagePreloader.onload = function() {
            $('#lightbox-image').attr('src',settings.imageArray[settings.activeImage][0]);
            // Perfomance an effect in the image container resizing it
            _resize_container_image_box(objImagePreloader.width,objImagePreloader.height);
            // for reducing problem with navigation using keyboard (switching some pic at one time)
            _disable_keyboard_navigation();
            // clear onLoad, IE behaves irratically with animated gifs otherwise
            objImagePreloader.onload=function(){};
        };
        objImagePreloader.src = settings.imageArray[settings.activeImage][0];
    };