jQuery日记(2)--jQuery效果

  1. 显示/隐藏
    $("#btn1").click(function(){
    $("p").hide(speed, callback) ;         //  .show(1800, fresh())
    })
    $("p").toggle(speed, callback);


  2. 淡入/淡出
    $(".class").mouseover( function(){     //淡入
           $("p").fadeIn( slow, callback);         
    });
    $(".class").dbclick( function(){
           $("p").fadetoggle( slow, callback);    //切换淡入淡出
    })
    $(".class").hide( function(){
           $("p").fadeto(slow, 0.5, callback)          //控制透明度  0-1之间,最好选用这个!
    })

  3. 下滑/上滑
    div.panle{
         display: none;
         height: 150px;
    }
    $("#btn"). click(function(){
         $(".panle"). slidedown( slow, callback)        // .slideup()        .slidetoggle()
    })

  4. 动画(如需对位置进行改变,则应该将position属性改成relative, fixed, absolute) div.animation{        position: relative; } $document. ready(function(){          $("button"). click(function(){                   $("div.animation"). animate({                       left:'+=200px';      //相对于当前位置左移 200px                       opacity:' 0.5 ';        //透明度为50%                       height: ' toggle' ;  // 预约义的toggle 每点击一次上滑/下滑                       })          }) })