jquery动画基础

  1. 根据id改变字体大小的动画
    <div class="speech">样式切换</div>
    <div id="switcher">
        <button id="switcher-large">click me</button>
    </div>
    var $speech=$("div.speech");
    var defaultSize=$speech.css("fontSize");
    $("#switcher button").click(function(){
        //alert("123")
        var num=parseFloat($speech.css("fontSize"),10);            
        //alert(num);    //弹出默认字体大小16
        switch(this.id){
            case 'switcher-large':
            num *= 1.4;
            break;
            case 'switcher-small':
            num /= 1.4;
            break;
            default:
            num=parseFloat(defaultSize,10);
            
        }
        $speech.animate({fontSize:num+"px"},"slow")
    })

     

  2. 淡入淡出
  3. $("p").hide();
    $("a").click(function(){
      $("p").animate({
        opacity:'toggle',  //淡入淡出的效果
        height:'toggle'    //由上到下的显示效果
        },"slow"); })
posted @ 2015-12-09 17:09  leestar  阅读(147)  评论(0编辑  收藏  举报