jQuery animate() 在 Google Chrome 和 Safari 中的左侧位置
Posted
技术标签:
【中文标题】jQuery animate() 在 Google Chrome 和 Safari 中的左侧位置【英文标题】:jQuery animate() left position in Google Chrome and Safari 【发布时间】:2011-11-12 19:13:18 【问题描述】:我正在尝试创建一个简单的动画,其中元素被附加到容器后从左侧滑入,如下所示:
$('#container').append(
$('<div class="item" style="left:-300px;top:0"></div>').animate( left : 0 , 300)
);
容器隐藏了溢出,宽度为 300 像素。 附加的 'item' 元素也有 300px 宽度并且在附加时位于容器之外,然后应该滑入直到它到达 'left : 0'。
它可以在 Firefox 中使用,但 Google Chrome 和 Safari 只是将其显示在容器中,而不会将其滑入。
有什么想法吗?
【问题讨论】:
您是否想过使用display:none;
和slideToggle()
来代替?可能会让事情变得容易一些。
你会如何使用 slideToggle() ?您不能使用此方法指定位置。
你完全正确,我在这里混淆了 2 件事,我真正想到的是使用 animate(width:'show')
,如下所示:bueltge.de/test/jquery_horizontal_slide.php - 很抱歉造成混淆。
【参考方案1】:
可能你需要在动画之前添加元素:
$('<div class="item" style="left:-300px;top:0"></div>').appendTo('#container').animate( left : 0 , 300)
【讨论】:
你说得对——我只是在追加后尝试这样做,它工作正常。以上是关于jQuery animate() 在 Google Chrome 和 Safari 中的左侧位置的主要内容,如果未能解决你的问题,请参考以下文章