如何加快淡出/淡出
我使用下面的代码来淡出/淡出每秒图像，但是我希望每1/2秒将图像淡入淡出。 我可以将setInterval更改为500，但这只会导致一些混乱。 我显然需要重新定义淡入淡出。
我有bootstrap加载，所以我猜这些函数是在bootstrap js中定义的，但我如何重新指定它们的时间？
var $els = $('div[id^=image]'),
i = 0,
len = $els.length;
var start = 1;
var end = 999999999999999;
jQuery(function () {
$els.slice(1).hide();
spin = setInterval(function () {
$els.eq(i).fadeOut(function () {
i = Math.floor(Math.random() * len);
$els.eq(i).fadeIn();
});
start = new Date().getTime();
if (start > end) {
clearInterval(spin);
}
}, 1000);
{% for m in myusers %}
if (i == {{ forloop.counter0 }}) { document.getElementById('name{{ forloop.counter0 }}').style.display = 'Block';}
{% endfor %}
});
既然你使用jQuery，为什么不使用fadeOut / fadeIn或fadeToggle ？
$(document).ready(function() {
setInterval(function() {
$('.a1, .a2').stop().fadeToggle(500);
}, 500);
});.wrapper {
position: relative;
width: 100px;
height: 100px;
margin: 1px;
display: inline-block;
}
.a1,
.a2 {
position: absolute;
left: 0;
top: 0;
width: 100px;
height: 100px;
background-color: blue;
}
.a2 {
display: none;
background-color: red;
}
.wrapper2 .a1 {
display: none;
}
.wrapper2 .a2 {
display: block;
}<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="wrapper">
<div class="a1"></div>
<div class="a2"></div>
</div>
<div class="wrapper wrapper2">
<div class="a1"></div>
<div class="a2"></div>
</div>var box = document.getElementById('box');
function fadeOutIn(elem, speed ) {
if (!elem.style.opacity) {
elem.style.opacity = 1;
} // end if
var outInterval = setInterval(function() {
elem.style.opacity -= 0.02;
if (elem.style.opacity <= 0) {
clearInterval(outInterval);
var inInterval = setInterval(function() {
elem.style.opacity = Number(elem.style.opacity)+0.02;
if (elem.style.opacity >= 1)
clearInterval(inInterval);
}, speed/50 );
} // end if
}, speed/50 );
} // end fadeOut()
fadeOutIn(box, 2000 );
你好，请看我的解决方案。 这是你的帮助与否。 谢谢。
链接地址: http://www.djcxy.com/p/64765.html