jQuery Custom Gallery和jCarousel问题 [英] jQuery Custom Gallery and jCarousel problem

查看:70
本文介绍了jQuery Custom Gallery和jCarousel问题的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

可以在此处看到活动站点: http://www.studioimbrue.com/index2.php

当前编码存在两个小问题.第一:当页面加载并且您试图单击其中一张大图像前进时,什么也没有发生.单击缩略图后,即可使用大图像的单击功能.我正在尝试对其进行修复,以便在页面加载时,用户可以开始点击大图.

第二个:单击图像时,缩略图的高光改变.唯一的问题是,一旦超过4,就需要查看当前"缩略图,因此轮播应该转到该缩略图.现在,该代码为nextThumb.closest('.thumbscontainer').jcarousel('next');,但是每次单击时它都会滚动.感谢您的帮助

解决方案

您将$('.container .captions li').click(...)代码放在缩略图的单击处理程序中,因此,只有在单击第一个缩略图之后,才添加完整图像的单击事件./p>

您应该将该代码块(包括其关闭代码});)放置在其他click处理程序之外.

此外,您应该更改

var nextThumb = nextLi
    .closest('.thumbscontainer')
    .find('.thumbscontainer li:eq(' + nextLi.index() + ')');

.closest('.container').

Active site can be seen here: http://www.studioimbrue.com/index2.php

There are currently two small problems with the coding. First: when the page loads and you attempt to click on one of the large images to advance, nothing happens. Once a thumbnail is clicked, the click functionality of the large image comes available. I'm trying to fix it so when the page loads, the user can just start clicking the large image.

Second: when an image is clicked, the thumbnail highlight changes. The only problem there is once it gets past 4, the "current" thumbnail needs to be seen, thus the carousel should go to that one. Right now the code for that is nextThumb.closest('.thumbscontainer').jcarousel('next'); but that makes it scroll every time you click. Thanks for any help

解决方案

You put the $('.container .captions li').click(...) code inside the thumbnails' click handler, so the click event for the full image is only added after the first thumbnail is clicked.

You should put that block (including its closing });) outside the other click handler.

Also, you should change

var nextThumb = nextLi
    .closest('.thumbscontainer')
    .find('.thumbscontainer li:eq(' + nextLi.index() + ')');

to .closest('.container').

这篇关于jQuery Custom Gallery和jCarousel问题的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆