我正在为一个项目创建自己的图库,需要滑动事件。于是在jsfiddle上找到了下面的代码,并插入了所有必要的文件,它显示了列表和所有内容,但是滑动仍然无法工作。我是否将jquery代码放在正确的位置?还是有其他问题?以下是我的代码:
<html>
<head>
<meta charset="utf-8" />
<title>Home</title>
<!-- Meta viewport tag is to adjust to all Mobile screen Resolutions-->
<meta name="viewport"
content="width=device-width, initial-scale=1, maximum-scale=1" />
<link rel="stylesheet" type="text/css" href="Css/style.css" />
<link rel="stylesheet" type="text/css" href="Css/Jstyle.css" />
<link rel="stylesheet" type="text/css" href="Css/jquery.mobile.theme-1.2.0.css" />
<link rel="stylesheet" type="text/css" href="http://code.jquery.com/mobile/1.0b2/jquery.mobile-1.0b2.min.css" />
<script type="text/javascript" src="Javascript/jquery1.js"></script>
<script type="text/javascript" src="Javascript/jquery2.js"></script>
<script type="text/javascript" src="css/jq1.6.2.js"></script>
<script type="text/javascript">
$("#listitem").swiperight(function() {
$.mobile.changePage("#page1");
});
</script>
</head>
<body>
<div data-role="page" id="home">
<div data-role="content">
<ul data-role="listview" data-inset="true">
<li id="listitem"> Swipe Right to view Page 1</a></li>
</ul>
</div>
</div>
<div data-role="page" id="page1">
<div data-role="content">
<ul data-role="listview" data-inset="true" data-theme="c">
<li id="listitem">Navigation</li>
</ul>
<p>
Page 1
</p>
</div>
</div>
</body>