我使用jQuery,jQuery UI和jQuery mobile来构建iPhone / iPad的Web应用程序.
现在我创建的图像,他们应该是可拖动的,所以我这样做：
现在我创建的图像,他们应该是可拖动的,所以我这样做：
<!DOCTYPE html>
<html>
<head>
<Meta http-equiv="Content-type" content="text/html; charset=utf-8">
<title>Drag - Test</title>
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.0a2/jquery.mobile-1.0a2.min.css" />
<script src="http://code.jquery.com/jquery-1.4.4.min.js"></script>
<script src="http://code.jquery.com/mobile/1.0a2/jquery.mobile-1.0a2.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.7/jquery-ui.min.js"></script>
</head>
<body>
<div>
<div style="width:500px;height:500px;border:1px solid red;">
<img src="http://upload.wikimedia.org/wikipedia/en/thumb/9/9e/JQuery_logo.svg/200px-JQuery_logo.svg.png" class="draggable" alt="jQuery logo" />
<img src="http://upload.wikimedia.org/wikipedia/en/a/ab/Apple-logo.png" class="draggable" alt="Apple Inc. logo" />
</div>
</div>
</body>
<script type="text/javascript">
$(document).ready(function() {
$(".draggable").draggable();
});
</script>
</html>
在这里可以看到现场示例：http://jsbin.com/igena4/
问题是,整个页面都想滚动.我在苹果的HTML5示例中搜索,发现这是为了阻止页面的滚动,以便图像是可拖动的：
...
onDragStart: function(event) {
// stop page from panning on iPhone/iPad - we're moving a note,not the page
event.preventDefault();
...
}
但问题是对我来说,我该怎么把它包含进我的jQuery？我在哪里可以获得活动？
最好的祝福.
解决方法
尝试这个图书馆
https://github.com/furf/jquery-ui-touch-punch
Just follow these simple steps to enable touch events in your jQuery
UI app:
Include jQuery and jQuery UI on your page.
06000
Include Touch Punch after jQuery UI and before its first use.
Please note that if you are using jQuery UI’s components,Touch Punch must be included after jquery.ui.mouse.js,as Touch Punch
modifies its behavior.06001
There is no 3. Just use jQuery UI as expected and watch it work at the touch of a finger.
06002