javascript - 忽略点击超时

发布于 2024-10-27 15:58:00 字数 1441 浏览 4 评论 0原文

我有一个幻灯片,效果很好,图像之间留有 3 秒的间隙。

我还有一组动态生成的链接,单击这些链接时,下一个图像对应于该链接。

我想要做的是跳过单击这些链接之一时的 3 秒超时 - 然后在更改图像后重新启动超时。

代码如下:

$(document).ready(function() {

var images=new Array();
var totalimages=6;
var totallinks=totalimages;
var nextimage=2;

while (totallinks>0) {
    $(".quicklinks").prepend("<a href='#' class='"+(parseInt(totallinks))+"' onclick='return false'>"+(parseInt(totallinks))+"</a> ");
    totallinks--;
}

function runSlides() {
    if(runSlides.opt) {
        setTimeout(doSlideshow,3000);
    }
}

function doSlideshow()
    {
        if($('.myImage').length!=0)
            $('.myImage').fadeOut(500,function(){slideshowFadeIn();$(this).remove();});
        else
            slideshowFadeIn();
    }

function slideshowFadeIn()
    {
        if(nextimage>=images.length) 
            nextimage=1;

        $('.container').prepend($('<img class="myImage" src="'+images[nextimage]+'" style="display:none;">').fadeIn(500,function() {
            runSlides();
            nextimage++;
        }));
    }

if(runSlides.opt) {} else {
    images=[];
    totalimages=6;
    while (totalimages>0) {
        images[totalimages]='/images/properties/images/BK-0'+parseInt(totalimages)+'.jpg';
        totalimages--;
    }
    runSlides.opt = true;
    runSlides();
}

$(".quicklinks a").live('click', function() {
    nextimage=$(this).attr("class");
});


});

I have a slideshow which works fine, leaving a 3 second gap between images.

I also have a set of dynamically generated links which when clicked on, the next image is corresponds to that link.

What I want to do is skip the 3 second time out when one of these links is clicked - then restart the timeout after the image is changed.

Code below:

$(document).ready(function() {

var images=new Array();
var totalimages=6;
var totallinks=totalimages;
var nextimage=2;

while (totallinks>0) {
    $(".quicklinks").prepend("<a href='#' class='"+(parseInt(totallinks))+"' onclick='return false'>"+(parseInt(totallinks))+"</a> ");
    totallinks--;
}

function runSlides() {
    if(runSlides.opt) {
        setTimeout(doSlideshow,3000);
    }
}

function doSlideshow()
    {
        if($('.myImage').length!=0)
            $('.myImage').fadeOut(500,function(){slideshowFadeIn();$(this).remove();});
        else
            slideshowFadeIn();
    }

function slideshowFadeIn()
    {
        if(nextimage>=images.length) 
            nextimage=1;

        $('.container').prepend($('<img class="myImage" src="'+images[nextimage]+'" style="display:none;">').fadeIn(500,function() {
            runSlides();
            nextimage++;
        }));
    }

if(runSlides.opt) {} else {
    images=[];
    totalimages=6;
    while (totalimages>0) {
        images[totalimages]='/images/properties/images/BK-0'+parseInt(totalimages)+'.jpg';
        totalimages--;
    }
    runSlides.opt = true;
    runSlides();
}

$(".quicklinks a").live('click', function() {
    nextimage=$(this).attr("class");
});


});

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

扫码二维码加入Web技术交流群

发布评论

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

评论(1

灰色世界里的红玫瑰 2024-11-03 15:58:00

您可以使用此代码停止超时:

var t = setTimeout(myFunction,3000);
clearTimeout(t);

使用此代码,您可以在用户单击按钮并直接调用该函数时中止超时。然后就可以重新开始超时了。

希望这有帮助。

You can stop a timeout using this code:

var t = setTimeout(myFunction,3000);
clearTimeout(t);

Using this, you can abort your timeout when the user clicks the button and call the function directly. Then you can restart the timeout.

Hope this helps.

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文