没有任何 UI 框架的 PhoneGap App 的自定义页面幻灯片转换答案

【问题标题】：Custom page slide transition for PhoneGap App without any UI Frameworks没有任何 UI 框架的 PhoneGap App 的自定义页面幻灯片转换
【发布时间】：2024-01-01 08:09:01
【问题描述】：

我的新 PhoneGap 项目需要自定义页面幻灯片过渡，请帮助我了解如何使用 html5、css3 和 javascript 创建自定义页面幻灯片过渡

谢谢提前..

【问题讨论】：

标签： javascript jquery html cordova css-transitions

【解决方案1】：

我会推荐 Christopher Conraets 的 PageSlider（Adobe 员工和 PhoneGap 的坚定支持者 - 如果您有兴趣，请查看他的 this talk，了解关于 PhoneGap 开发的良好规则）。

我现在正在使用它。感觉很好，而且很容易使用。

【讨论】：

Rory O'Keeffe，我试过这个，但是在使用 android 硬件返回按钮时出现了一些问题
嗨@Shafi，您可以在 onDeviceReady 函数中执行类似document.addEventListener("backbutton", onBackKeyDown, false); 的操作，其中 onBackKeyDown() 是执行您希望后退按钮执行的操作的函数，例如function onBackKeyDown(e) { logJs('Android back button captured'); e.preventDefault(); goBack(); return false; }

【解决方案2】：

看看这个插件pagingSlider。

特点

通过触摸滑动滑动到页面
通过单击菜单项自动切换到页面
动画移动页面浏览器
使用 QuoJS 集成触摸事件

【讨论】：

【解决方案3】：

** 沙菲请使用 **

transform translate3d 3d in css3

将页面左翻译为右，右翻译为左 example

【讨论】：

【解决方案4】：

您可以使用 Jquery Mobile 转换： http://view.jquerymobile.com/1.3.2/dist/demos/widgets/transitions/

【讨论】：

是的，Anas，我知道 jQuery Mobile 框架，但我正在寻找没有任何 ui 框架的页面转换...

【解决方案5】：

IScroll4对你来说是个好工具。http://cubiq.org/iscroll-4

【讨论】：