早上好.我正在制作一个简单的jQuery画廊的问题.它允许用户通过一些按钮循环浏览一组图像,同时在计时器上旋转这些图像.我的问题是用户能够多次点击该按钮,将淡入淡出的动画排队并反复重复,例如用户点击按钮5次>相同图像淡入/淡出5次>图库移动到下一张图像.
我尝试过使用:
$('#homeGalleryImage li a').unbind('click');
触发click事件然后重新绑定后:
$('#homeGalleryImage li a').bind('click');
完成之后,这只是在按下一次按钮之后删除了点击事件并且从不重新绑定它?
我也试过通过以下方式禁用按钮:
$('#homeGalleryImage li a').attr('disabled', true);
无济于事......?
还有一个次要问题,如果您在图像处于转换状态时设置单击按钮,则下一个图像显示为"淡化",就像不透明度已降低一样?很奇怪......以下是按钮点击的代码:
var i = 1;
var timerVal = 3000;
$(function () {
$("#homeGalleryControls li a").click(function () {
var image = $(this).data('image');
$('#galleryImage').fadeOut(0, function () {
$('#galleryImage').attr("src", image);
});
$('#galleryImage').fadeIn('slow');
$('.galleryButton').attr("src", "/Content/Images/Design/btn_default.gif");
$(this).find('img').attr("src", "/Content/Images/Design/btn_checked.gif");
i = $(this).data('index') + 1;
if (i == 4) {
i = 0;
}
timerVal = 0;
});
});
Run Code Online (Sandbox Code Playgroud)
以下是在计时器上循环显示图像的代码:
//Cycle through gallery images on a timer
window.setInterval(swapImage, timerVal);
function swapImage() …Run Code Online (Sandbox Code Playgroud)