javascript - JQuery持续淡入淡出

标签 javascript jquery animation

目前我使用的编辑器是Adobe Dreamweaver。在我的编辑器中如下 语句在试用期间有效,但是在我的浏览器(例如 Safari、Mozilla 和 Chrome)中,我的淡入和淡出根本不起作用。我希望它们不断淡出然后淡入,但图像仍然可见。有什么理由可以解释为什么这件事发生在我身上吗?

$(document).ready(function(){
    var x=0;
    while(x==0 ){
        $("#Imag1").fadeOut(3000);
    $("#Imag2").fadeOut(8000);
        $("#Imag3").fadeOut(6000); 
        x++;

    if(x==1){
        $("#Imag1").fadeIn(2000);
            $("#Imag2").fadeIn(5000);
            $("#Imag3").fadeIn(9000);
        x--;
        } 
    }
});

最佳答案

这是我的 fiddle http://jsfiddle.net/m7HcT/1/ 它创建了一个可重用的方法,供您调用任何要闪烁的元素。

HTML:

<div class='block' id='Imag1'></div>
<div class='block' id='Imag2'></div>
<div class='block' id='Imag3'></div>

jQuery:

fadeloop('#Imag1',1500,1200,true);
fadeloop('#Imag2',100,200,true);
fadeloop('#Imag3',3000,7000,true);

//The element is cached inside the function so we don't make 
//Multiple DOM calls on elements we have already found.
//Each Interval is completely independant

function fadeloop(el,timeout,timein,loop){
    var $el = $(el),intId,fn = function(){
         $el.fadeOut(timeout).fadeIn(timein);
    };
    fn();
    if(loop){
        intId = setInterval(fn,timeout+timein+100);
        return intId;
    }
    return false;
}

关于javascript - JQuery持续淡入淡出,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/18199457/

相关文章:

javascript - 类型声明适用于对象文字,但不适用于类实现

javascript - 使用 jquery 遍历列表

javascript - 如何修复 jslint 警告?

javascript - OO JavaScript 绕过 .call

javascript - 在中间件中访问应用程序配置

javascript - 我可以使用 JSON 数组作为小型数据库吗?

javascript - 这是否可能 - 在页面加载后更改显示在 div 中的文本值?

CSS3居中动画

javascript - Raphael:使用简单的无限动画逐渐减速动画

css - 如何动画 SVG 来绘制线条而不是轮廓?