jquery 方向传递给 animate()

Posted

技术标签:

【中文标题】jquery 方向传递给 animate()【英文标题】:jquery passing in direction to animate() 【发布时间】:2012-05-05 22:52:06 【问题描述】:

我从 div click 和 a 获取方向,试图将其传递给 animate 函数

var direction = $(this).attr('class').split(' ')[1];
var scrollAmount = 285;
$('#slider').animate(direction:'-=' + scrollAmount, 'slow');

怎么了?

谢谢

【问题讨论】:

【参考方案1】:

animate 函数的第一个参数接受 CSS 属性,说明动画结束的最终属性。你不能那样传递方向。听起来您要么想设置 left 或 scrollLeft 量并改变方向,那么您应该查看方向的值,并根据您想要的方式使用 -= 或 +=。

var sign;

if (direction == 'left') sign = '-=';
else sign = '+=';

$('#slider').animate(left:sign + scrollAmount, 'slow');

或者如果它是你试图传递的属性

var prop = ;
prop[direction] = scrollAmount;
$('#slider').animate(prop, 'slow');

【讨论】:

如果我不想使用 '-=' 或 '+=' 运算符,因为 chrome 中的缩放问题?是否有“等效”调用???【参考方案2】:

animate 中没有这样的属性称为方向,因此出现错误。检查documentation。

根据评论编辑

那么你应该在css中将left或right作为第一个参数传递给动画

jQuery animate API 文档中的示例代码

<!DOCTYPE html>
<html>
<head>
  <style>
div 
  position:absolute;
  background-color:#abc;
  left:50px;
  width:90px;
  height:90px;
  margin:5px;

</style>
  <script src="http://code.jquery.com/jquery-latest.js"></script>
</head>
<body>
  <button id="left">&laquo;</button> <button id="right">&raquo;</button>
<div class="block"></div>

<script>
$("#right").click(function()
  $(".block").animate("left": "+=50px", "slow");
);

$("#left").click(function()
  $(".block").animate("left": "-=50px", "slow");
);

</script>

</body>
</html>

【讨论】:

我试图通过“左”或“右”的方向

以上是关于jquery 方向传递给 animate()的主要内容,如果未能解决你的问题,请参考以下文章

jquery - .animate 在 IE 中不起作用

jQuery 动画

jQuery 动画

jQuery 怎么控制一个动画方向?

jQuery 暂停/恢复动画

jQuery中动画animate(下)