Zeptoアニメーション関数で変数を使用する

Question

私はtranslateYに変数 "drawerHeight"を使用して、どれくらいの翻訳をしたいかを指定します。私は引き出しの内容が反応するように計画しているので、私はdivの現在の高さを取得する必要があります。

これは私が何をしたいのか分かっているが、それを行う構文を理解することができない状況の1つです。

"drawerHeight"をem/pxの固定量で置き換えると、コードは現在動作しますが、これは私がやりたいことではありません。あなたはこの行を変更する必要が

var drawerHeight = $(".drawer").css('height'); 
    $(".toggle").click(function() { 
    drawerHeight 
    if (opened == false) { 
    $(".drawer").animate({ 
     translateY: '0', 

    }, 600, 'ease-in') 
    } 
    if (opened == true) { 
    $(".drawer").animate({ 
     translateY: '-drawerHeight', 

    }, 600, 'ease-out')  
    } 
    opened = !opened; 
    }) 

http://codepen.io/LivMac/pen/WwLEKe

Answer 1

：また

translateY: '-' + drawerHeight, 

---

に

translateY: '-drawerHeight', 

を、私は可能な.height()機能を使用するためにあなたをお勧めしますゼプトとo。こうすることで、エレメントの埋め込みも考慮されます。

var drawerHeight = $(".drawer").height(); 
translateY: '-' + drawerHeight + 'px', 

はここにペンです：http://codepen.io/thewisenerd/pen/zqeRQa