javascript - HTML 中类似桌面的过渡效果

标签 javascript html animation css-transitions

我想在我的 HTML Web 应用程序中创建导航幻灯片动画效果。我只是想知道这是否可能。

场景是:第 1 页 = 联系人列表,第 2 页 = 联系人详细信息。

当用户在列表中选择联系人并单击详细信息时,我希望联系人列表向左滑出,而联系人详细信息从右侧滑入(如 iOS 导航应用程序)。

这可能吗?联系人列表和详细信息是两个单独的网页。

如有任何建议,我们将不胜感激。

谢谢

最佳答案

我的第一个想法是使用 Jquery 移动过渡。这个框架真的很接近iOS的UI

http://jquerymobile.com/demos/1.0a4.1/docs/pages/docs-transitions.html

但是您必须更清楚单独网页的含义。 如果您使用动态内容,您可以使用 iframe、 anchor 标记,甚至 ajax 调用。

我个人确实更喜欢 Jquery 的移动方法。 每个“页面”都包含在单个 html 文档中带有页面标记的 div 中,也可以加载具有不同过渡效果的其他 html 页面

看一下这个例子 http://jsfiddle.net/4Bgx7/2648/

关于javascript - HTML 中类似桌面的过渡效果,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/12765961/

相关文章:

JavaScript - setInterval 只运行一次

javascript - 如何制作具有简单视差效果的 Bootstrap 轮播?

javascript - 如何在 AngularJs 中获取 json 对象和嵌套对象的属性名称和值?

javascript - 如果文本框 val 为空,则在 javascript 中添加到数组

html - 页面不滚动 HTML CSS

jquery - 仅初始页面加载动画

ios - 我怎样才能取消-[UIScrollView zoomToRect :animated:]?

javascript - 计算出的宽度与 td 元素的实际宽度不同

html - 如何修复 : favicon only showing up on the homepage of my website

c# - 播放时停止动画(攻击)循环播放