我用jQuery Tools实现了一个简单的可滚动照片库 然后我将自动滚动行为附加到jQuery工具滚动器以创建照片幻灯片 然后我将jQuery颜色框附加到照片幻灯片放映,以提供更大版本的图像。
我遇到了以下问题。我希望我能用最好的方式解释它们,因为这种行为有时是不可预测的。
主要问题是,当我停止幻灯片放映并点击图像以带上彩色框或下一个/上一个按钮时,幻灯片再次开始播放。有没有办法禁用这种行为??
另一个问题是,当我点击彩色框时,看起来有9个图像而不是7个。你可以看到通过点击一张照片并看到彩色框在缩放版本的右上方生成的索引。照片。
为什么会这样?我找不到解释。
最后,最烦人的部分已经发生过两次而且我无法重现的是,jQuery工具在某些时候可以滚动,当你打开和关闭颜色框时它会弄乱索引并滚动一个额外的步骤导致一张空白的不存在的照片..这也搞砸了左下角当前照片编号的显示 - 导航。
我知道这两个图书馆并不一定要合作,但我在这里发布了这些问题,以防有人做了相同或相关的脚本。
任何帮助都会非常感激。
Javascript代码:
$("#gallery").scrollable({circular:true}).autoscroll({autoplay:true});
var api = $("#gallery").data("scrollable");
var indd = api.getIndex();
api.onSeek(function() {
$("#cur-p").html(parseInt(api.getIndex()+1));
$("#tot-p").html(api.getSize());
});
$("#slid").toggle(function() {
api.stop();
$(this).html("SLIDESHOW ON");
return false;
}, function() {
api.play();
$(this).html("SLIDESHOW OFF");
return false;
}
);
$("#cur-p").html(parseInt(api.getIndex()+1));
$("#tot-p").html(api.getSize());
$("a[rel=color-box]").colorbox();
*更新 * 到目前为止,我已经设法找出一种奇怪的行为 Colorbox显示的图像总数超过了。这是因为它是在autoscroll插件之后调用的。自动滚动在开始之前创建2个额外的div,在圆形属性打开时创建一个。因此,colorbox会找到它们并将它们添加到等式中。
如果我没有在所有颜色框中调用autoscroll工作正常 因此,解决方案就是调用colorbox:
$("#gallery").scrollable().find("a[rel=color-box]").colorbox();
当colorbox加载完毕后,将autoscroll插件应用到库中。 但是我不确定如何在已创建的可滚动实例上应用自动滚动。