短いいくつかのjqueryコードの実現1つのピクチャの上へスクロールする切り替え

animate()パラメータの説明:
animate()メソッドは、CSSプロパティセットのカスタムアニメーションを実行します.
この方法はCSSスタイルによって要素をある状態から別の状態に変更する.CSSアトリビュート値は徐々に変化し、アニメーション効果を作成できます.
アニメーションを作成できるのは数値値のみです(margin:30 pxなど).文字列値はアニメーションを作成できません(background-color:redなど).
PS:しかし、最新のjquery uiフレームワークを引用すればbackgroudColor、colorなどの属性もグラデーションを実現できます.
PS:「+=」または「-=」を使用して相対アニメーション(relative animations)を作成します.
まずjqueryフレームワークを引用しなければなりません.あなたは知っています.
コードを見てみましょう.

 
  
 
  
 
  
 
  
 
  
 
  
 
  
 
  
 
  
 
  
One
 
  
Two
 
  
Three
 
  
 
  
 
  
 
  
 
  <br>$(document).ready(function(){ 
  <br>var Top=-350;//           ，         DIV      
  <br>var Time=500;//       
  <br>function move(){ 
  <br>$("#box").animate({"margin-top":Top},Time);//animate  ，             
  <br>Top+=-350;//              
  <br>if(Top==-1050)//         DIV        
  <br>{ 
  <br>Top=0;//      0 
  <br>Time=400;//       
  <br>} 
  <br>else 
  <br>{ 
  <br>Time=500;//       
  <br>} 
  <br>} 
  <br>setInterval(move,3000);//3     move() 
  <br>}) 
  <br> 
  
 
  
 
  
 
 

jsセクションでは、ロールバック効果を実現することもできます.

 
  
$(document).ready(function(){ 
  
var Top=-350; 
  
var Time=500; 
  
var more=-50; 
  
function move(){ 
  
$("#box").animate({"margin-top":Top+more},Time); 
  
$("#box").animate({"margin-top":Top},300); 
  
Top+=-350; 
  
if(Top==-1050) 
  
{ 
  
Top=0; 
  
more=50; 
  
Time=400; 
  
} 
  
else 
  
{ 
  
Time=500; 
  
more=-50; 
  
} 
  
} 
  
setInterval(move,3000); 
  
})