jQuery学习---第二天

jQuery动画

$(selector).animate({params},speed,callback);
<!---
必需的 params 参数定义形成动画的 CSS 属性。
可选的 speed 参数规定效果的时长。它可以取以下值："slow"、"fast" 或毫秒。
可选的 callback 参数是动画完成后所执行的函数名称
--->

　　例子：

<script> 
$(document).ready(function(){
  $("button").click(function(){
    $("div").animate({
      left:'250px',
      opacity:'0.5', //不透明度
      height:'150px',
      '150px'
    });
  });
});
</script> 
<!--如果需要生成颜色动画，您需要从 jQuery.com 下载 Color Animations 插件。--->

　　

<!--jQuery animate() - 使用预定义的值--->
$("button").click(function(){
  $("div").animate({
    height:'toggle'
  });
});

　　

jQuery stop() 方法

jQuery stop() 方法用于停止动画或效果，在它们完成之前。

stop() 方法适用于所有 jQuery 效果函数，包括滑动、淡入淡出和自定义动画。

 

js语句是逐一执行的，这里可能就会有一个问题，如果设置了动画时长。那么可能会动画没有执行完就执行下面的代码了。这时候推荐这样写。

  $("button").click(function(){
  $("p").hide(1000,function(){
    alert("hello  word!");
    });
  });
});

　　

通过 jQuery，您可以把动作/方法链接起来。Chaining 允许我们在一条语句中允许多个 jQuery 方法（在相同的元素上）。

意思就是说如果一个元素有多个动作。你不需要分开写，直接在后面追加就行了，当一个动画执行完，会紧跟着执行另一个动画。

 $("#p1").css("color","red").slideUp(2000).slideDown(2000);

　　

jQuery - 获得内容和属性