我是jQuery / java脚本的新手;试图做一个滑块。请解决以下问题。
我想使div(类是滑块)永远淡出和淡入;请检查此代码。
是否可以为此使用setInterval()函数?
<html>
<head>
<title>Slider</title>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<script src="../jquery/jquery.min.js"></script>
<style>
.slider1{
width: 500px;
height: 250px;
margin: 0 auto;
background-image: url(images/rectblue.png);
}
</style>
<script type="text/javascript">
var runForever = $(document).ready(function () {
$(".slider1").fadeOut(2000, function () {
$(".slider1").fadeIn(2000);
});
});
runForever();
//setInterval(runForever, 4000);
//This runs the function 'runForever' one time only, how to run it every 4 sec?
//the above commented out code does not work.
</script>
</head>
<body>
<div class="slider1"></div>
</body>
最佳答案
您没有将runforever
定义为函数,而是将其作为对$(document).ready
的调用的结果。如果将其定义为函数并将其放在setInterval
中,则它将起作用。
var flashSlider = function () {
$(".slider1").fadeOut(2000, function () {
$(".slider1").fadeIn(2000);
});
};
$(document).ready(function () {
setInterval(flashSlider, 4000);
});
小提琴:http://jsfiddle.net/uoqdfhdb/
我认为以递归方式永久写入Flash更加优雅一些:
var flashForever = function () {
$(".slider1").fadeOut(2000).fadeIn(2000, flashForever);
};
$(document).ready(function () {
flashForever();
});
http://jsfiddle.net/uoqdfhdb/1/
除了我不知道尾递归是否最终会导致堆栈溢出。