jQuery和緩解作用環和暫停

http://jsfiddle.net/6jxQs/18/jQuery和緩解作用環和暫停

這是我的代碼，我想以某種方式與元素的700毫秒超時顯示一個接一個。

當前所有元素都是一次顯示。

我試着用setInterval和setTimeout函數bu沒有成功。

任何人都可以幫助我或指點我一些教程如何做到這一點？

代碼：

<!DOCTYPE html> 
<html> 
<head> 
<title>.::Efekat::.</title> 
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
<link rel="stylesheet" type="text/css" href="css/stil.css" /> 
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script> 
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.18/jquery-ui.min.js"></script> 
<script> 
$(document).ready(function(){ 
    $('.mydiv').css('opacity','0'); 
    $("#demo").click(function(){ 
     $("div").each(function(index){ 
      var self = $(this); 
      self.not(':animated').css(
       {'opacity': 0.8} 
       ).effect(
        "scale", 
        { 
         origin:['middle','center'], 
         from:{width:self.width()+20,height:self.height()+20}, 
         percent: 100, 
         direction: 'both', 
         easing: "linear" 
        }, 
        700, 
        function(){ 
         $(this).animate({"opacity": 1}) 
        }); 

     }); 
    }); 
}); 
</script> 

</head> 
<body> 
<span id="demo">klikni!</span> 
<div class="mydiv">Element 1</div> 
<div class="mydiv">Element 2</div> 
<div class="mydiv">Element 3</div> 
<div class="mydiv">Element 4</div> 
<div class="mydiv">Element 5</div> 
</body> 
</html>

來源

2013-02-18 Bumblebee989

對我來說，（鉻）沒有任何元素都出現了。 – howderek 2013-02-18 15:36:45

適合我chorme，ff甚至ie – Bumblebee989 2013-02-18 15:37:50

您正在看到元素1，元素2的過渡？對我來說，他們隱藏着。 – howderek 2013-02-18 15:38:32

使用jQuery的delay()

$("div").each(function(index){ 
      var self = $(this); 
      self.not(':animated').css(
       {'opacity': 0.8} 
       ).delay(700 * index) 
       .effect(
        "scale", 
        { 
         origin:['middle','center'], 
         from:{width:self.width()+20,height:self.height()+20}, 
         percent: 100, 
         direction: 'both', 
         easing: "linear" 
        }, 
        700, 
        function(){ 
         $(this).animate({"opacity": 1}) 
        }); 

      }, 100); 
     });

來源

2013-02-18 15:41:54

歡呼！謝啦！ – Bumblebee989 2013-02-18 15:45:54

如果有效，請將我的答案標記爲解決方案！ :) – 2013-02-18 15:47:44

標記:)再次感謝:) – Bumblebee989 2013-02-18 16:12:25

jQuery和緩解作用環和暫停

回答

相關問題