在Zepto动画函数中使用变量

Using Variables in Zepto Animation function

本文关键字：变量 函数 Zepto 动画      更新时间：2023-09-26

我想在translateY中使用变量"drawerHeight"来指定我希望翻译的程度。我需要获得div的当前高度，因为我计划抽屉的内容具有响应性。

在这种情况下，我知道自己想做什么，但却不知道做什么的语法

如果你用任何固定的em/px数量替换"drawerHeight"，代码目前可以工作，但这不是我想做的。

  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

您需要更改此行：

  translateY: '-drawerHeight',

至

  translateY: '-' + drawerHeight,

此外，我建议您使用zepto提供的.height()功能。这样，您的元素填充也会被考虑在内。

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

这是一支钢笔：http://codepen.io/thewisenerd/pen/zqeRQa

相关文章：