2012/07/01

animate on jQuery

初學 jQuery 第一個感想就是 selector 非常好用,加上 effects 功能後,可以說是懶人的一大福音。

在 effects 中有看到 slide down / up,區塊會上下滑動,但沒看到左右滑動的,所以自己試著刻一個。

<style>
#box {
   width: 200px;
   display:  inline;
}
</style>

$('#box').animate(   {
      width: '0px',
      display: 'none'
   } , 'slow'  };

不過發現 box 不會消失,用開發人員工具去看 display 屬性沒有被改變。後來看了文件才發現是自己耍蠢。

jQuery 建立動畫特效的方式,是依照 duration 以及物件屬性的數字差,並在固定時間間隔對屬性的數值做遞增、遞減,是「數值」遞增、遞減,display 屬性值並非數字,所以 jQuery 沒辦法處理。


ps. 用了 jQuery 以後就不會寫 Javascript 了 .... Orz

沒有留言:

張貼留言