jquery.cycle and touchslider.js working together?
i have a little slide gallery working with jquery.cycle http://jquery.malsup.com/cycle/
开发者_运维技巧but i want work with slide touch on iphone or ipad too, so i tried with this script. http://www.zackgrossbart.com/hackito/touchslider/
but i can't make work those script together, only one of those work here the script i have
<!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>
Any ideas to make those scripts work together?? thanks in advance!!
take a look at this: http://www.netcu.de/jquery-touchwipe-iphone-ipad-library its working great
加载中,请稍侯......
精彩评论