MooTools的1.1：做一個功能的setStyle平穩過渡

Question

所以我有這個迄今爲止的工作：

<script type="text/javascript"> 
    window.addEvent('domready', function() { 
     $('casestudies').addEvent('click', function(){ 
      $('gomobileinfo').setStyle('margin-left', '-500px'); 
     }); 
    }); 
</script> 

非常簡單，並能正常工作;基本上向左滑動一個div。但我試圖讓它平穩過渡而不是立即。我知道在MooTools 1.2中使用tween或morph會非常簡單，但我必須使用1.1版來執行此項目。

Answer 1

您可以使用

new Fx.Style('gomobileinfo', 'margin-left', {duration : 2000}).start(-500); 

演示：

new Fx.Style('gomobileinfo', 'margin-left', {duration : 2000}).start(-500);

#gomobileinfo{ 
 
    width:100px; 
 
    height:200px; 
 
    background:red; 
 
    margin-left:500px; 
 
}

<script src="http://cdn.strategiqcommerce.com/ajax/libs/mootools/1.1.2/mootools-yui-compressed.js"></script> 
 
<div id="gomobileinfo">Go Mobile</div>

http://jsfiddle.net/A5fVx/

附：這個MooTools版本是非常古老的，你應該升級和/或告訴老闆升級。