【问题标题】:JQuery image slider not working... What have I done wrong?JQuery 图像滑块不起作用...我做错了什么?
【发布时间】:2013-03-04 06:35:59
【问题描述】:

它应该是简单的图像滑块... 为什么,为什么这不起作用?我遵循了一些教程,但它是 youtube 上的视频教程,所以我没有在某些网站上比较他们的工作代码,但是,根据他们的指导和我一周的知识,我找不到错误.. .

<html>
<head>
<title>JQuery test</title>
<style type="text/css">
.slider {
width:500px;
height:250px;
overflow:hidden;
margin:30px auto;
background-image:url(img/loading.gif);
background-repeat:no-repeat;
background-position:center;
}
.slider img {
width:800px;
height:350px;
}
</style>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.10.1/jquery-ui.min.js"></script>
<script type="text/javascript">
function Slider(){
$(".slider#img1").show("fade",500);
$(".slider#img1").delay(5500).hide("slide",{direction:'left'},500);

var sc=$(".slider img").size();
var count=2;

setInterval(function(){
    $(".slider #img"+count).show("slide",{direction:"right"}, 500);
    $(".slider #img"+count).delay(5500).hide("slide", {direction:"left"}, 500);

    if(count==sc){
    count=1;
    } else {
    count=count+1;
}, 6500);
}
}
</script>
</head>
<body onload="Slider()">

<div class="slider">
<img id="img1" src="img/1.jpg" />
<img id="img2" src="img/2.jpg" />
<img id="img3" src="img/3.jpg" />
</div>


</body>
</html>

【问题讨论】:

  • 你有什么错误吗??
  • 不,它只是行不通... W3 Validator 传递“doctype and alt missing”错误女巫是无关紧要的。
  • 更新:当我尝试加载脚本时,Opera Dragonfly 返回“未定义变量:滑块”...
  • 你忘了把 setInterval 函数的右括号 } 放在 else 后面?
  • 我需要 count=count+1; 而不是 "c​​ount=count+1; }, 6500); } }" } }, 6500);多谢了,伙计!我失去了最后一小时发现错误..该死的notpad和睡眠不足:)

标签: javascript jquery image slider


【解决方案1】:

您将} 括号放错了else 和setInterval

function Slider(){
  $(".slider#img1").show("fade",500);
  $(".slider#img1").delay(5500).hide("slide",{direction:'left'},500);

  var sc=$(".slider img").size();
  var count=2;
  setInterval(function(){
    $(".slider #img"+count).show("slide",{direction:"right"}, 500);
    $(".slider #img"+count).delay(5500).hide("slide", {direction:"left"}, 500);

    if(count==sc){
      count=1;
    } else {
      count=count+1;
    }
  }, 6500);  //<---here
}

【讨论】:

    猜你喜欢
    • 2020-08-30
    • 2019-08-25
    • 1970-01-01
    • 2012-06-13
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2013-05-16
    • 2017-02-09
    相关资源
    最近更新 更多