JQUERY 的属性

Original 2016-11-01 17:13:18 570
abstract:一.显示和隐藏的属性 hide(隐藏),show(显示) 下面是例子<script type="text/javascript">$(document).ready(function(){    $("#hide").click(function(){       $(&quo

一.显示和隐藏的属性 

hide(隐藏),show(显示) 下面是例子

<script type="text/javascript">

$(document).ready(function(){
    $("#hide").click(function(){
       $("p").hide();
         });
       $("#show").click(function(){
          $("p").show();
       });
});

</script>

二.淡入淡出的属性  

fadein(淡入)  fadeout(淡出)fadeToggie (开关)fadeTO (慢慢的淡出到一定的时间) 下面是例子

<script type="text/javascript">

 $(document).ready(function(){
    $("button").click(function(){
        $("#div1").fadeIn();

        $("#div2").fadeOut("slow");

        $("#div3").fadeToggle(3000);

   $("#div4").fadeTo("slow",0.15); 

    });   

});
</script>

三.滑动的属性

 slideDown(滑动向下)  slideToggie(滑动开关)slideUP (滑动向上)下面是例子

<script type="text/javascript">

 $(document).ready(function(){
    $("button").click(function(){
        $("#div1").slideDown();

        $("#div2").slideUP("slow");

        $("#div3").slideToggle(3000);

    });   

});

</script>

四.jQuery - animate()方法  还有属性

naimate(动画的属性) 

必需的 params 参数定义形成动画的 CSS 属性。

可选的 speed 参数规定效果的时长。它可以取以下值:"slow"、"fast" 或毫秒。

可选的 callback 参数是动画完成后所执行的函数名称。 

下面是例子:

<script type="text/javascript">
 $(document).ready(function(){     
  $("#start").click(function(){
   $("div").animate({left:'100px'},5000); 
    $("div").animate({fontSize:'3em'},5000);    });
});
</script>

五.滑动停止的属性

stop(停止)   下面是例子:

<script type="text/javascript">
 $(document).ready(function(){  
       $("#flip").click(function(){
        $("#panel").slideDown(5000);  
          });      
            $("#stop").click(function(){   
              $("#panel").stop();
    });
});
</script>


Release Notes

Popular Entries