我从一个教程中获取此代码,在javascript/jQuery中制作一个自动推进幻灯片,它在jsfiddle中运行得非常好.但是,当我将所有内容都带入Dreamweaver时,它似乎就停止了工作.一切都在那里,我已经链接了所有相关文件(.js和.css)以及jQuery库.出于某种原因,它根本不起作用.这是代码.
HTML
<div class="fadeIn">
<img src="image1.png" height="500" width="800"/>
<img src="image2.png" height="500" width="800"/>
<img src="image3.png" height="500" width="800"/>
<img src="image4.png" height="500" width="800"/>
</div>
Run Code Online (Sandbox Code Playgroud)
CSS
.fadeIn {
position: relative;
width: 800px;
height: 500px;
}
.fadeIn img {
position: absolute;
left:0;
top:0;
}
Run Code Online (Sandbox Code Playgroud)
Javascript/jQuery
$(function(){
$('.fadeIn img:gt(0)').hide();
setInterval(function(){
$('.fadeIn :first-child').fadeOut()
.next('img').fadeIn()
.end().appendTo('.fadeIn');
}, 3000);
});
Run Code Online (Sandbox Code Playgroud)
这是标题
<script src="SlideShow.js" type="text/javascript"></script>
<script src="jquery-1.7.2.min.js" type="text/javascript"></script>
<link rel="stylesheet" type="text/css" href="SlideShow.css">
Run Code Online (Sandbox Code Playgroud)