「jQuery Mobile」swipeleft、swiperightイベントを使用するサンプル
構文
$(selector要素).on(“swipeleft",function(){
// some code
});
$(selector要素).on(“swiperight",function(){
// some code
});
使用例1
<script>
$(document).on("pagecreate","#arkgame",function(){
$("p").on("swipeleft",function(){
alert("左方向へのスワイプ");
});
});
</script>
</head>
<body>
<div data-role="page" id="arkgame">
<div data-role="header">
<h1>swipeleft イベント</h1>
</div>
<div data-role="main" class="ui-content">
<p style="border:1px solid black;margin:5px;">右から左へのスワイプで発火する</p>
</div>
</div>
使用例2
<script>
$(document).on("pagecreate","#arkgame",function(){
$("p").on("swiperight",function(){
alert("右方向へのスワイプ");
});
});
</script>
</head>
<body>
<div data-role="page" id="arkgame">
<div data-role="header">
<h1>swiperight イベント</h1>
</div>
<div data-role="main" class="ui-content">
<p style="border:1px solid black;margin:5px;">左から右へのスワイプで発火する</p>
</div>
</div>