我想使用JQuery循环创建一个幻灯片,观众可以通过单击图像按钮查看上一张或下一张幻灯片。
我使用从这里下载的javascript:http://jquery.malsup.com/cycle/int2.html
以下是我的 HTML 的样子:
<script type="text/javascript" src="js/jquery.cycle.all.js"></script>
<script type="text/javascript">
$(document).ready(function()
{
$('#slide').cycle({
fx: 'fade',
speed: 'fast',
timeout: 0,
next: '#next',
prev: '#prev'
});
</script>
并与幻灯片分开:
<div id="slideshow-wrapper">
<div id="slideshow-control">
<a id="prev" href="#"><img src="images/prev.png" alt="Previous" /></a>
<a id="next" href="#"><img src="images/next.png" alt="Next" /></a>
</div>
<div id="slide">
<img src="images/banner/banner01.jpg" alt=" " />
<img src="images/banner/banner02.jpg" alt=" " />
<img src="images/banner/banner03.jpg" alt=" " />
</div>
</div><!--#slideshow-wrapper end-->
我看到了关于此事的其他帖子,我尝试了建议的解决方案; 但是我仍然无法让幻灯片工作。因为我对 JavaScript 了解不多,所以我非常确定我只是错过了一些东西和/或复制了错误的东西。
如果有人能看看这里出了什么问题,我将不胜感激。
您没有使用正确数量的大括号/括号来关闭脚本:
$(document).ready(function()
{
$('#slide').cycle({
fx: 'fade',
speed: 'fast',
timeout: 0,
next: '#next',
prev: '#prev'
}
); //end of #slide.cycle
}); //end of doc-ready
另外,请确保您的下一个和上一个 ID 不会再次出现。
Ctr+F 在开发人员工具的"元素"选项卡中,然后搜索"上一页"或"下一页"。