189 8069 5689

jquery的动画效果和使用示范-创新互联

1.基本效果
show([s,[e],[fn]])  显示
hide([s,[e],[fn]])  隐藏
toggle([s],[e],[fn]) 显示隐藏切换
不带参数 直接显示隐藏
带参数  speed  easing  fn
不建议带speed  easing
fn  指动画完成之后
2.滑动
slideDown([s],[e],[fn])
slideUp([s,[e],[fn]])
slideToggle([s],[e],[fn])
3.淡入淡出
fadeIn([s],[e],[fn])  淡入
fadeOut([s],[e],[fn])  淡出
fadeTo([[s],o,[e],[fn]])  透明度的动画
fadeToggle([s,[e],[fn]])
4自定义
animate(p,[s],[e],[fn])1.8  params 属性  speed  easing fn
stop([c],[j])1.7
 停止当前正在执行的动画
delay(d,[q]) 延迟后续动画的执行
finish([queue])1.9+

创新互联公司专注于建阳网站建设服务及定制,我们拥有丰富的企业做网站经验。 热诚为您提供建阳营销型网站建设,建阳网站制作、建阳网页设计、建阳网站官网定制、小程序定制开发服务,打造建阳网络公司原创品牌,更为您提供建阳网站排名全网营销落地服务。



      
  • mousedown([[data],fn])
  •   
  • mouseenter([[data],fn])
  •   
  • mouseleave([[data],fn])
  •   
  • mousemove([[data],fn])
   $(function () {
     //声明变量控制奇偶
     var count = 0;
     $(".btns").click(function () {
       addanimate();
     });
     function addanimate() {
       $("li").each(function (index) {
         var delaytime = index * 100;
         $(this).delay(delaytime).animate({
           width: count % 2 == 0 ? 200 : 100
         }, 1000);
       }).last().queue(function () {
         //当前最后一个元素动画的队列执行完成之后执行的回调函数
         count++;
         $(this).dequeue();//删除当前元素最前端的队列函数
         addanimate();
       });
     }

     $(".btnp").click(function () {
       $("li").stop();
     });
     $(".btnf").click(function () {
       $("li").finish();
     });
   });

另外有需要云服务器可以了解下创新互联cdcxhl.cn,海内外云服务器15元起步,三天无理由+7*72小时售后在线,公司持有idc许可证,提供“云服务器、裸金属服务器、高防服务器、香港服务器、美国服务器、虚拟主机、免备案服务器”等云主机租用服务以及企业上云的综合解决方案,具有“安全稳定、简单易用、服务可用性高、性价比高”等特点与优势,专为企业上云打造定制,能够满足用户丰富、多元化的应用场景需求。


分享文章:jquery的动画效果和使用示范-创新互联
网站链接:http://jkwzsj.com/article/dsojdj.html

其他资讯