jquery-lightbox 奇怪的行为（不会前进到下一个/上一个图像）

发布于 2024-10-22 02:50:02 字数 1203 浏览 3 评论 0原文

我有两个无法克服的行为问题。首先，我无法成功滚动图像。当我单击灯箱中的下一个/上一个按钮时，它只会停留在当前图像上。

此外，如果我直接单击灯箱图像的中间，它就会关闭。

$(function(){


$('#photos a').lightBox({fixedNavigation:true, imageBtnPrev:'{{site}}media/imageslightbox-btn-prev.gif',imageBtnNext:'{{site}}media/images/lightbox-btn-next.gif',containerResizeSpeed:350,});

});

所以我尝试过使用和不使用“fixedNavigation:true”参数。

我的标记如下：

  <div id="photos">
        <ul>
            <li><a href="{{site}}media/apt-img4.jpg"><img src="{{site}}media/apt-img4.jpg" width="185" height="110" alt="Thumb" /></a></li> 
            <li><a href="{{site}}media/apt-img4.jpg"><img src="{{site}}media/apt-img5.jpg" width="185" height="110" alt="Thumb" /></a></li>
            <li><a href="{{site}}media/apt-img4.jpg"><img src="{{site}}media/apt-img6.jpg" width="185" height="110" alt="Thumb" /></a></li>
            <li><a href="{{site}}media/apt-img4.jpg"><img src="{{site}}media/apt-img7.jpg" width="185" height="110" alt="Thumb" /></a></li>
        </ul>
    </div>

感谢您的帮助！

原文

I'm having two behavioral issues that I can't overcome. First, I can't successfully scroll through images. When I click the Next/Prev buttons within the lightbox, it just stays on the current image.

Additionally, if I click squarely in the middle of the lightbox image, it closes.

$(function(){


$('#photos a').lightBox({fixedNavigation:true, imageBtnPrev:'{{site}}media/imageslightbox-btn-prev.gif',imageBtnNext:'{{site}}media/images/lightbox-btn-next.gif',containerResizeSpeed:350,});

});

So I've tried this with and without the "fixedNavigation:true" parameter.

My markup is as follows:

  <div id="photos">
        <ul>
            <li><a href="{{site}}media/apt-img4.jpg"><img src="{{site}}media/apt-img4.jpg" width="185" height="110" alt="Thumb" /></a></li> 
            <li><a href="{{site}}media/apt-img4.jpg"><img src="{{site}}media/apt-img5.jpg" width="185" height="110" alt="Thumb" /></a></li>
            <li><a href="{{site}}media/apt-img4.jpg"><img src="{{site}}media/apt-img6.jpg" width="185" height="110" alt="Thumb" /></a></li>
            <li><a href="{{site}}media/apt-img4.jpg"><img src="{{site}}media/apt-img7.jpg" width="185" height="110" alt="Thumb" /></a></li>
        </ul>
    </div>

thanks for any help!

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

長街聽風 2024-10-29 02:50:03

Brendan - 看起来你原来的 href 都指向同一个（第一张）图像，YNhat 纠正了这一点。如果您复制/粘贴了他的标记，这可能就是问题的原始原因。

回复收藏 0 原文

一曲琵琶半遮面シ 2024-10-29 02:50:02

我发现你的脚本有问题，但我不确定它能解决你的问题。

您的 JavaScript 中有一个额外的逗号。这会导致 IE 出现问题。应该是：

$('#photos a').lightBox({fixedNavigation:true, imageBtnPrev:'{{site}}media/imageslightbox-btn-prev.gif',imageBtnNext:'{{site}}media /images/lightbox-btn-next.gif',containerResizeSpeed:350});

在您的 html 代码中，您加载所有缩略图的示例图像。应该是：

I found to problem in your script, but I'm not sure it solve your problem.

You have a extra comma in your javascript. It will cause issue in IE. It should be:

$('#photos a').lightBox({fixedNavigation:true, imageBtnPrev:'{{site}}media/imageslightbox-btn-prev.gif',imageBtnNext:'{{site}}media/images/lightbox-btn-next.gif',containerResizeSpeed:350});

In your html code, you load the sample image for all the thumbnails. It should be:

 <div id="photos">
            <ul>
                <li><a href="{{site}}media/apt-img4.jpg"><img src="{{site}}media/apt-img4.jpg" width="185" height="110" alt="Thumb" /></a></li> 
                <li><a href="{{site}}media/apt-img5.jpg"><img src="{{site}}media/apt-img5.jpg" width="185" height="110" alt="Thumb" /></a></li>
                <li><a href="{{site}}media/apt-img6.jpg"><img src="{{site}}media/apt-img6.jpg" width="185" height="110" alt="Thumb" /></a></li>
                <li><a href="{{site}}media/apt-img7.jpg"><img src="{{site}}media/apt-img7.jpg" width="185" height="110" alt="Thumb" /></a></li>
            </ul>
        </div>

回复收藏 0 原文

~没有更多了~