tha*_*oru 3 jquery swipe-gesture
在使用jQuery/jQuery mobile进行滑动时,Stackoverflow中有很多主题.但是,它们似乎都没有按照我想要的方式工作.以下是我的phonegap应用程序的索引页面的结构.正如本主题推荐的那样,我尝试了jgestures插件.
<html>
<head>
<title>App</title>
<script type="text/javascript" src="lib/cordova-2.2.0.js"></script>
<script type="text/javascript" src="lib/jquery-1.8.2.min.js"></script>
<script type="text/javascript" src="lib/jgestures.js"></script>
</head>
<body>
<div id="home">
<div id="headersec">
<!-- some elements like images here-->
</div>
<div id="screen1">
<!-- three 80x80 images go here -->
</div>
<div id="screen2">
<!-- three other 80x80 images go here-->
</div>
</div>
</body>
</html>
Run Code Online (Sandbox Code Playgroud)
我想在我的deviceready事件中做的就是这个
document.addEventListener("deviceready",onDeviceReady,false);
function onDeviceReady() {
$('#screen1').bind('swipeleft',showNext); //show next hides screen1, shows screen2
$('#screen2').bind('swiperight',showPrev);//show prev hides screen2, shows screen1
}
Run Code Online (Sandbox Code Playgroud)
但这不适用于我尝试的任何示例代码.任何人都可以告诉我做错了什么?
看起来这个问题有类似的问题.解决方案是做这样的事情:
document.addEventListener("deviceready", function(){
$('#screen1').bind('swipeleft',showNext); //show next hides screen1, shows screen2
$('#screen2').bind('swiperight',showPrev);//show prev hides screen2, shows screen1
},false);
Run Code Online (Sandbox Code Playgroud)
或者您可能只需要onDeviceReady在调用事件侦听器之前定义函数.