jquery效果:jQuery的animate效果演示

一个简单的animate函数尝试, 这个效果在web应用中非常的实用,提供大家参考!

  1. <script type="text/javascript"> 
  2. $(document).ready(function(){  
  3.    $(".side-box h3").toggle(function(){  
  4.    $(this).addClass("box-arrow");  
  5.      $(this).next(".side-text").animate({  
  6.      height: 'toggle',   
  7.      opacity: 'toggle'  
  8.     }, "slow");  
  9.    return false;  
  10.  
  11.    },function(){  
  12.      $(this).next(".side-text").animate({  
  13.      height: 'toggle',   
  14.      opacity: 'toggle'  
  15.     }, "slow");  
  16.    $(this).removeClass("box-arrow");  
  17.    return false;  
  18.    });  
  19. });  
  20. </script> 

演示请看:
http://www.fvzone.com/jquery/demos/fade.html

Tags:  jqueryanimate jquery图片切换效果 jquery幻灯片效果 jquery效果

延伸阅读

最新评论

发表评论