JS整页旋转

Question

我正在尝试让用户通过点击向左或向右选择不同的主页，并显示一个全新的页面。我知道有一些jQuery轮播可以用纯x轴或y轴方式实现这一点，但不是旋转。理想情况下，背景图像将同步，整体效果就像地球旋转一样，在地球的不同部分有不同的元素集。地球每个部分的元素仍然需要互动和

有没有人有任何想法？

Answer 1

使用jQuery，您应该能够使用.slideDown和slideUp方法执行此操作。

基本上，当他们执行您想要触发切换的操作时，您将slideUp（）添加到'current'容器并在下一个容器上执行slideDown（）。动画将同时运行。

http://jsfiddle.net/g19fanatic/stLvj/

Answer 2

这里没有多少人会为您提供完整的解决方案，但他们会很乐意解决具体问题。

• 这些主页位于不同的域名和/或是否在您的控制之下？
• 你是怎么看全球的？一种球形失真，还是只是在边缘无缝连接？
• 概念的顺畅性有多重要？

脱离我的头顶，这就是我（尝试）这样做的方式：

• 将主页加载到单独的iframes
中
• 将iframe拉伸到窗口的尺寸
• 调整轮播脚本以设置iframes而不是images
的动画
• 覆盖iframe的某种“上/下”控件。也许与z-index。

Answer 3

查看http://thetruth.com/上的landing.js文件（或者让页面计时器运行以查看轮播） 你想要的基本上是那个，但有动画而不是淡入淡出页面。

只需在加载新页面时添加CSS3变换以缩放和滑动，而不是添加淡入/淡出。 polyfill将在JS中添加转换功能（请参阅https://github.com/louisremi和Modernizr的jquery.transform.js，jquery.transition.js）