Warning: file_get_contents(/data/phpspider/zhask/data//catemap/4/string/5.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Jquery setinterval()和clearinterval()-清除时,不会自动设置动画_Jquery_Background_Slideshow_Setinterval_Clearinterval - Fatal编程技术网

Jquery setinterval()和clearinterval()-清除时,不会自动设置动画

Jquery setinterval()和clearinterval()-清除时,不会自动设置动画,jquery,background,slideshow,setinterval,clearinterval,Jquery,Background,Slideshow,Setinterval,Clearinterval,所以我试图构建一个动画背景图像,它将在一系列图像中循环 这个想法还在于,当您单击页面上的任何导航元素时,循环将暂停 单击主页按钮时,循环将再次启动(从当前图像) 这在它的当前状态下工作,但是循环在重新启动时不是自动的,相反,每次淡入淡出/滑动/任何操作都必须按下home(主页)按钮 脚本如下: $(document).ready(function(){ var imgArr = new Array( 'img/slides/slide1.jpg', 'i

所以我试图构建一个动画背景图像,它将在一系列图像中循环

这个想法还在于,当您单击页面上的任何导航元素时,循环将暂停

单击主页按钮时,循环将再次启动(从当前图像)

这在它的当前状态下工作,但是循环在重新启动时不是自动的,相反,每次淡入淡出/滑动/任何操作都必须按下home(主页)按钮

脚本如下:

$(document).ready(function(){

    var imgArr = new Array(
        'img/slides/slide1.jpg',
        'img/slides/slide2.jpg',
        'img/slides/slide3.jpg');

    var preloadArr = new Array();
    var i;


    // Preload
    for(i=0; i < imgArr.length; i++){
        preloadArr[i] = new Image();
        preloadArr[i].src = imgArr[i];
    }

    var currImg = 1;
    var IntID = setInterval(startSlider, 4000);

    // Image Rotator

    function startSlider(){
        $('.mainbg').animate({opacity: 0}, 1200, "easeInOutExpo", function(){
            $(this).css('background','url(' + preloadArr[currImg++%preloadArr.length].src + ') no-repeat center center fixed');
            $(this).css({'background-size': 'cover' , '-webkit-background-size': 'cover' , '-moz-background-size': 'cover' , '-o-background-size': 'cover' ,});
            }).animate({opacity: 1}, 1200, "easeInOutExpo");
        }

    function stopSlider() {
        clearInterval(IntID);
    }

    $(".topnav ul li a").click(stopSlider);

    $("#home").click(startSlider);
});
$(文档).ready(函数(){
var imgArr=新数组(
'img/slides/slide1.jpg',
'img/slides/slide2.jpg',
‘img/slides/slide3.jpg’;
var preload=new Array();
var i;
//预载
对于(i=0;i

如果有人能给我指出正确的方向,我将不胜感激!向你问好,卡斯珀

这应该能帮到你

var IntID = setTimer();

function setTimer(){
     i = setInterval(startSlider, 4000);
     return i;
}

function stopSlider() {
    clearInterval(IntID);
}

//Restart Timer
// Option 1 make a restartSlider function and call it
$("#home").click(restartSlider);
function restartSlider(){
      IntID = setTimer();
}

//Option 2 create an anonymous function only for that click event.
$("#home").click(function(){
     IntID = setTimer();
});

鉴于我是这方面的“相当”初学者,我将如何绑定IntID=setTimer();点击?我会用几种方法修改答案。非常感谢你,马特!这就成功了。我要做的就是确保我明白我们在这里做什么。干杯欢迎您,祝您在未来的javascript和jQuery努力中好运!你从来没有叫过stopSlider()我不明白=!?