Jq文字动态特效实现

利用JqAnimate实现的文字特效效果(大小,位置,透明度等变换)。

 

var WordDemoHandler={
     DemoOne:function(){
         var mMarginLeft=100;
         for(var i=0;i<$("#demoOne").children().length;i++){
             var target=$($("#demoOne").children()[i]);
             target.animate({marginLeft:mMarginLeft+"px",opacity:1},100+i*100);
              mMarginLeft+=target.width();
         }
     },
     DemoTwo:function(){
         $("#demoTwo>span").animate({marginTop:0+"px",fontSize:35+"px",opacity:1,marginLeft:100+"px"},500);
     },
     DemoThree:function(){
          var mMarginLeft=100;
          for(var i=0;i<$("#demoThree").children().length;i++){
             var target=$($("#demoThree").children()[i]);
             target.animate({marginLeft:mMarginLeft+"px",opacity:1},100+i*100);
              mMarginLeft+=target.width();
              target.animate({fontSize:85+"px"},300,function(){$(this).animate({fontSize:35+"px"},300);});
         }
     }
 }

 演示以及原文:http://www.pengyaou.com/LegendsZ/File/2014/10/21/20141021173454484.html

你可能感兴趣的:(JavaScript,jquery,css)