【问题标题】:Use JQuery to animate one div over another使用 JQuery 为一个 div 设置动画
【发布时间】:2015-02-21 17:15:03
【问题描述】:

我已经查看了很多其他帖子,所以请修改这不是重复的,因为其他帖子没有回答我的查询。我有以下 HTML:

<div id="page"></div>
<div id="page1">
  <h1>Page One</h1>
  <a href="#" id="topage2">Page 2</a>
</div>
<div id="page2">
  <h1>Page Two</h1>
  <a href="#" id="topage1">Page 1</a>
</div>

我将如何使用 JQuery 制作动画并向上滑动 'page2' DIV 以替换 'page1' div,反之亦然?我试过了:

var page1 = $('#page1').offset();
var page2 = $('#page2').offset();
page2.top = page1.top;
page2.left = page1.left;

只是为了测试它,看看我是否可以将 'page1' 替换为 'page2' 但它不起作用。显然,该代码被封装在一个函数中,该函数用于转到每个页面的超链接使用,即 $('#topage1').click 等...

有没有人有任何想法,就像我说的已经看过其他一些问题和答案,但它们似乎都没有工作或做我想要的。提前感谢您的帮助。

【问题讨论】:

  • 你在寻找滚动动画,点击链接浏览器会滚动到目标链接吗?

标签: jquery jquery-animate jquery-slide-effects


【解决方案1】:

使用 JQuery 你可以简单地:

$( "#page1" ).slideUp();
$( "#page2" ).slideDown();

http://api.jquery.com/slideup/

【讨论】:

  • 嗨,这根本不起作用。我试过把它放进去,但它似乎并没有达到我想要的效果。我希望第 1 页 DIV 消失,第 2 页 DIV 向上滑动。这几乎就是我想要发生的事情。
  • 你安装了 JQuery 库吗? w3schools.com/jquery/jquery_get_started.asp
猜你喜欢
  • 2011-05-26
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2020-06-09
  • 1970-01-01
  • 2012-04-04
  • 1970-01-01
相关资源
最近更新 更多