Javascript “一种方法”；“像iPhone一样”；网页之间的转换，但不需要整个（移动）web框架的开销，并使用iScroll（v4）

我正在寻找一种简单的方法来使用本机iPhone应用程序或Android本机应用程序中常见的过渡（例如滑块效果，即整个页面向左或向右滑动）

我知道在我的web应用程序中，使用jQuery Mobile、Wink、iUi等框架可以实现网页之间的转换

另外，我的应用程序需要一个固定的页脚和一个带有可滚动内容的固定页眉。我尝试使用jquerymobile，但尽管内容的滚动效果很好，但固定页眉和页脚的呈现效果却不太好

因此，我改用iScroll 4，但我不能使用jQuery mobile只进行转换，因为jQuery mobile使用DOM等，这会在div的放置中产生一些问题

我正在尝试使用iUI，但尽管它似乎没有jQ mobile那么“广泛”，但它仍然是一个完整的web应用框架。但我目前只想寻求过渡

有没有一种方法可以在不使用javascript框架的情况下实现这些“完整网页”转换？ 同样，那些框架，如iUI，只将所有页面放在一个分区内（jQuery Mobile不这样做，这很好），将它们分隔在几个分区内。。我想这可能是iScroll的问题吧

最好的方法是能够在单独的html页面之间进行转换，但我不知道这是否可行（我的意思是不使用AJAX技术）

我只针对使用webkit的现代设备（Android、iDevices..）

---

非常感谢您的帮助

忘记iScroll for mobile应用程序。它运行良好，但并非适用于所有webkit设备，而且您将遇到大量Android设备的问题。如果你想要像本地应用程序一样的东西，你需要一个容器模型。容器模型基本上有一个页眉和页脚，中间有一个动态容器。Twitter和Flikr等移动网站都使用这一功能。您可以使用iframe或ajax加载动态容器（但我个人不喜欢iframe和移动设备）。此外，在使用任何框架之前，考虑与成本（大小、未来依赖性和可伸缩性、开销解析JS……等）的好处，因为移动不是桌面开发，许多开发人员似乎忘记了这一事实。我目前在一家大型社交网站工作，我们有自己的框架，比我们需要的多出一个字节。我们在过去使用JQuery，但对于我们所服务的webkit设备（大小+解析时间+依赖性等等），结果它太膨胀了，我们最终杀死了它。

您可以看看。它非常接近iPhone的行为，包括所有的转换。

这可能有点离谱，但如何让每个“页面”都成为自己的div，所有的div都被包装在一个矩形div中，即pageWidth*numberOfPages宽……然后有两个功能：一个是将给定页面立即移动到当前查看页面的右侧，然后是一个动画循环，将主div向右或向左滑动到设备的宽度？而且，如果您确实有公共元素，您可以将它们放在一个单独的div中，该div不会滑动（因此您的内容会滑动到静态片段下）。jQuery mobile中固定标题的呈现有什么问题？是动画速度还是定位错误？@RobotWoods谢谢你的回答，但我想当你的设备选择横向视图时，这可能会有问题，因为你给出了一些固定的像素宽度，而不是100%，例如，尽管你也可以通过编程方式检查这一点，我想。@NicholasEvans很好，固定的页眉+页脚自然会出现jQMobile将在您滚动时消失，在页面停止移动时重新出现，虽然这在向上移动时更平滑，因为它将很好地褪色，但在向下滚动时保持不变。这就是jQm从一开始就与iScroll 4（jQm仅用于转换，所以我不使用固定的页脚）混合使用时的方式（为了保持“本机”滚动功能，我猜不是用javascript伪造的），在iPhone上，它使我的iScroll样的页脚（一些底部：0 div）看起来太低了40 px（我猜底部的safari工具栏高度）所以它90%是隐藏的