携帯電話でドラッグ可能なJquery UIと組み合わせてオーバーフロースクロールを実際に動作させることができるかどうか疑問に思っています。Jquery UI がモバイルで動作しないことは知っていますが、マウスだけでなくタッチにも反応するようにハックするスクリプトを持っています。
今、コードをドロップしてJquery UIをドラッグ可能にする場合、オーバーフロースクロールはそうではありません。誰かがそれを回避する方法を知っているかどうか疑問に思っていますか?
ここに私のコードがあります
<!DOCTYPE HTML>
<html >
<head>
<meta name="viewport" content="initial-scale=1.0,user-scalable=no, width=100%" />
<meta name="apple-mobile-web-app-capable" content="yes" />
<meta name="apple-mobile-web-app-status-bar-style" content="black" />
<script src="http://code.jquery.com/jquery-1.9.1.js"></script>
<script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>
<script src="http://webprofolio.freeserver.me/jquery.ui.touch-punch.min.js"></script>
<style>
#parent
{
background-color:blue;
width:400px;
height:400px;
}
#content
{
background-color:red;
width:380px;
height:380px;
overflow-y:auto;
margin:auto;
}
#thebody
{
background-color:green;
width:600px;
height:400px;
}
</style>
</head>
<body>
<div id="thebody">
<div id="parent">
<div id="content">
<p>
Hello gentlemen welcome to the end of the days!!! you want to buy some sandwiches? No thanks, I don't like strawberries
Hello gentlemen welcome to the end of the days!!! you want to buy some sandwiches? No thanks, I don't like strawberries
Hello gentlemen welcome to the end of the days!!! you want to buy some sandwiches? No thanks, I don't like strawberries
Hello gentlemen welcome to the end of the days!!! you want to buy some sandwiches? No thanks, I don't like strawberries
Hello gentlemen welcome to the end of the days!!! you want to buy some sandwiches? No thanks, I don't like strawberries
Hello gentlemen welcome to the end of the days!!! you want to buy some sandwiches? No thanks, I don't like strawberries
Hello gentlemen welcome to the end of the days!!! you want to buy some sandwiches? No thanks, I don't like strawberries
Hello gentlemen welcome to the end of the days!!! you want to buy some sandwiches? No thanks, I don't like strawberries
Hello gentlemen welcome to the end of the days!!! you want to buy some sandwiches? No thanks, I don't like strawberries
Hello gentlemen welcome to the end of the days!!! you want to buy some sandwiches? No thanks, I don't like strawberries
Hello gentlemen welcome to the end of the days!!! you want to buy some sandwiches? No thanks, I don't like strawberries
Hello gentlemen welcome to the end of the days!!! you want to buy some sandwiches? No thanks, I don't like strawberries
Hello gentlemen welcome to the end of the days!!! you want to buy some sandwiches? No thanks, I don't like strawberries
Hello gentlemen welcome to the end of the days!!! you want to buy some sandwiches? No thanks, I don't like strawberries
Hello gentlemen welcome to the end of the days!!! you want to buy some sandwiches? No thanks, I don't like strawberries
Hello gentlemen welcome to the end of the days!!! you want to buy some sandwiches? No thanks, I don't like strawberries
Hello gentlemen welcome to the end of the days!!! you want to buy some sandwiches? No thanks, I don't like strawberries
Hello gentlemen welcome to the end of the days!!! you want to buy some sandwiches? No thanks, I don't like strawberries
Hello gentlemen welcome to the end of the days!!! you want to buy some sandwiches? No thanks, I don't like strawberries
Hello gentlemen welcome to the end of the days!!! you want to buy some sandwiches? No thanks, I don't like strawberries
Hello gentlemen welcome to the end of the days!!! you want to buy some sandwiches? No thanks, I don't like strawberries
The last paragraph
</p>
</div>
</div>
</div>
<script>
touchMove();
function touchMove()
{
$( "#parent" ).draggable({ axis: "x" , containment:"parent"},
{});
}
</script>
</body>
</html>