我有一个使用 jquery.cycle 的小幻灯片库 http://jquery.malsup.com/cycle/
但我也想在 iphone 或 ipad 上使用滑动触摸,所以我尝试了这个脚本。 http://www.zackgrossbart.com/hackito/touchslider/
但是我不能让这些脚本一起工作,只有一个可以工作 这是我的脚本
<!DOCTYPE HTML>
<html >
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Documento sin título</title>
<!--jquery cycle-->
<script type="text/javascript" src="jquery-1.4.4.min.js"></script>
<script type="text/javascript" src="jquery.cycle.all.2.72.js"></script>
<!-- -->
<!--touchslider-->
<script type="text/javascript" src="touchslider.js"></script>
<link type="text/css" rel="stylesheet" href="touchslider.css" />
<!-- -->
<script type="text/javascript">
$(document).ready(function() {
var $container = $('#slidebar').cycle({
fx: 'fade',
speed: 300,
timeout: 0,
pager: '#nav',
pagerAnchorBuilder: function(idx, slide) {
// return selector string for existing anchor
return '#nav li:eq(' + idx + ') a';
}
});
touchslider.createSlidePanel('#slidebar', 400, 0);
});
</script>
</head>
<body>
<div id="slidecont" >
<div id="slidebar">
<div class="cell" id="maintitle"><img src="1.jpg" width="400" height="600" /></div>
<div class="cell"><img src="2.jpg" width="400" height="600" /></div>
<div class="cell"><img src="3.jpg" width="400" height="600" /></div>
<div class="cell"><img src="4.jpg" width="400" height="600" /></div>
</div>
</div>
<ul id="nav">
<li><a href="">foto1</a></li>
<li><a href="">foto2</a></li>
<li><a href="">foto3</a></li>
<li><a href="">foto4</a></li>
</ul>
<div id="output"></div>
</body>
</html>
有什么想法可以让这些脚本协同工作吗? 提前致谢!!
最佳答案
关于javascript - jquery.cycle 和 touchslider.js 一起工作?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/5521077/