jquery动画

摘要：<button id="right">右移</button> <button id="stop">停止</button> <div class="box1"> php中文网</div> <script> $(doc

<button id="right">右移</button>
<button id="stop">停止</button>
<div class="box1"> php中文网</div>

<script>
$(document).ready(function(){
          $('.but1').click(function(){
            $('p').animate({fontSize:'40px'},1500)//属性名称font-size 一律改成驼峰写法：fontSize
          })  
          //同时操作多个css属性
           //使用预定义的值 show hide toggle
           $('.but2').click(function(){
            $('div').animate({
              // left:'400px',//如果想对元素位置进行一个位移，那么我们需要给当前元素设置一个position例如：
              // opacity:'0.3',
              // height:'400px',
              // width:'400px'
              width:'toggle'
              },1500)     
          })
          $('#right').click(function(){
            $('.box1').animate({left:'+500px'},3000)
            $('.box1').animate({fontSize:'30px'},500)
          })
           $('#stop').click(function(){
            $('.box1').stop(true)
         }) 
         })
</script>

总结：animate使用前习惯性写上.stop(),立即完成动画，达到友好体验

批改老师：天蓬老师批改时间：2019-04-22 13:56:08
老师总结：现在有很多优秀的动画库, 可以实现更多的功能 ,还有css3中也自带了很多原生的物效.... jQuery中的很多效果,都可以用这些替代的