使用 animate() 从右向左滑动 div

Posted

技术标签:

【中文标题】使用 animate() 从右向左滑动 div【英文标题】:Slide a div from right to left using animate() 【发布时间】:2013-04-18 23:20:58 【问题描述】:

我想要一个 div '.whole' 进行动画处理(从右向左滑动)

jQuery

$('#menu').click(function() 
      $('.whole').toggleClass('r2');
      $('#slideMenu').toggle();
);

.r2  right: 200px 

我无法正确使用函数 animate()。

【问题讨论】:

那么,您对animate 的尝试是什么样的? 我不知道如何使用它 :) 我只想为 .whole 制作动画(从右向左滑动) 【参考方案1】:

这应该可行:

$('#menu').click(function(event) 
      event.preventDefault(); // because it is an anchor element
      $('.whole').animate(
          right: '200px'
      );
      $('#slideMenu').toggle();
);

但是您的 position 属性应该已经在 CSS 中设置,否则您可能无法得到您所需要的。

Working JSFiddle

解释一下:函数接受一个属性的JS对象,像这样:


    right: '200px',
    somethingElse: 'value',
    myboolean: true

您也可以将其分配给一个 var 并将其传递给 animate

var cssProperties =  right: '200px' 

$('#menu').click(function() 
  $('.whole').animate(cssProperties);
);

您可以在documentation 中传递其他可阅读的论点。

【讨论】:

我真的很喜欢这个例子,它没有使用绝对位置,太棒了!!

以上是关于使用 animate() 从右向左滑动 div的主要内容,如果未能解决你的问题,请参考以下文章

在Xamarin android中从右向左滑动抽屉

jQuery从右向左滑动

如何使div从右向左滑动

未调用时滑动手势从右向左移动

从右向左滑动时未调用 UISplitViewControllerDelegate/UIPopoverDelegate 方法

我的应用程序使用片段,但我需要从左到右从右向左滑动