Question

我正在尝试使用jquery..i制作滑块我的滑块下载了循环插件，并且在我的文件中也包含了...我使用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>

Answer 1

您是否尝试过更改插件的位置？ <script type="text/javascript" src="jquery-2.1.0.min.js"></script>之前不应<script type="text/javascript" src="jquery.cycle.all.js"></script>吗？

尝试使用jquery制作滑块

1 个答案: