我正在尝试使用 jquery 制作一个 slider 。我为我的 slider 下载了循环插件并将其也包含在我的文件中......我为我的 slider 使用 7 图片。下面是代码......请告诉有什么问题
<!DOCTYPE html>
<html>
<head>
<style>
#hero{width:200px;height:220px;display:block;position:relative;margin:auto;border-style:solid;border-color:grey;}
#slider{width:200px;height:200px;display:block;position:absolute;}
#next{display:block;float:right;height:30px;width:30px;position:relative;z-index:99;cursor:pointer;}
#prev{display:block;float:left;height:30px;width:30px;position:relative;z-index:99;cursor:pointer;}
</style>
<script type="text/javascript" src="jquery.cycle.all.js"></script>
<script type="text/javascript" src="jquery-2.1.0.min.js"></script>
<script type="text/javascript">
$('#slider').cycle({
fx: 'scrollHorz',
timeout: 2000,
next: '#next',
prev: '#prev'
});
</script>
</head>
<body>
<div id="hero">
<div id="prev">
<img src="right.jpg">
</div>
<div id="next">
<img src="left.jpg">
</div>
<div id="slider">
<div id="1"><img src="1.jpg"></div><br><br>
<div id="2"><img src="2.jpg"></div><br>
<div id="3"><img src="3.jpg"></div><br>
<div id="4"><img src="4.jpg"></div><br>
<div id="5"><img src="5.jpg"></div><br>
<div id="6"><img src="6.jpg"></div><br>
<div id="7"><img src="7.jpg"></div><br>
</div>
</div>
</body>
</html>
最佳答案
你试过改变插件的位置吗?不应该<script type="text/javascript" src="jquery-2.1.0.min.js"></script>
在<script type="text/javascript" src="jquery.cycle.all.js"></script>
之前?
关于javascript - 尝试使用 jquery 制作 slider ,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/23329206/