我正在jquery中做一个滑块,但不幸的是它没有滑动。我包含了jquery.min.js和在DOM上运行。
滑块.js
$(function(){
$('.fadein img:gt(0)').hide();
setInterval(function(){
$('.fadein :first-child').fadeOut()
.next('img').fadeIn()
.end().appendTo('.fadein');},
3000);
});
html
<script src="js/slider.js"></script>
<script src="js/jquery-1.3.2.min.js"></script>
<div class="fadein">
<img src="images/mtcRechargeSlider.jpg">
<img src="images/iphoneSlider.jpg">
<img src="images/accessoriesSlider.jpg">
</div>
请尝试切换js引用顺序。通常,像slider.js这样的引用将依赖于jquery。所以只要把jquery放在slider.js前面,看看它是如何工作的。
<script src="js/jquery-1.3.2.min.js"></script>
<script src="js/slider.js"></script>
希望能有所帮助。:)
如果您指的是jquery滑块,则需要同时包含jquery和jquery.ui文件。以下是我通常包括的主题。。。
<link rel="stylesheet" type="text/css" href="//code.jquery.com/ui/1.11.3/themes/smoothness/jquery-ui.css">
<script type=" text/javascript" language="javascript" src="http://code.jquery.com/jquery-1.11.3.min.js"> </script>
<script type="text/javascript" language="javascript" src="http://code.jquery.com/ui/1.11.4/jquery-ui.min.js"> </script>
样本看起来更像这样。。。。
<script>
$(function() {
$('#fadein).slidesjs({
width: 940,
height: 528,
play: {
active: true,
auto: true,
interval: 4000,
swap: true,
pauseOnHover: true,
restartDelay: 2500
}
});
});
</script>