我需要优化以下代码。使用FOR尝试,但图像一次显示。
使用以下解决方案,但未进行优化。
$(document).ready(function(){
function fadeInOut () {
var $element1 = $('a#imagem01');
var $element2 = $('a#imagem02');
var $element3 = $('a#imagem03');
var $element4 = $('a#imagem04');
var $element5 = $('a#imagem05');
var $element6 = $('a#imagem06');
$element1.fadeIn(2000, function () {
$element1.fadeOut(2000, function () {
$element2.fadeIn(2000, function () {
$element2.fadeOut(2000, function () {
$element3.fadeIn(2000, function () {
$element3.fadeOut(2000, function () {
$element4.fadeIn(2000, function () {
$element4.fadeOut(2000, function () {
$element5.fadeIn(2000, function () {
$element5.fadeOut(2000, function () {
$element6.fadeIn(2000, function () {
$element6.fadeOut(2000, function () {
fadeInOut();
});});});});});});});});});});});});
}
fadeInOut();
});
我需要帮助!
答案 0 :(得分:1)
function fadeInOut() {
var elements = ['a#imagem01', 'a#imagem02', 'a#imagem03', 'a#imagem04', 'a#imagem05', 'a#imagem06'];
var index = 0;
var loopForever = false;
(function() {
var selfFunction = arguments.callee;
if((loopForever) && (index > elements.length-1)) index = 0;
if(index <= elements.length-1) {
$(elements[index++]).fadeIn(2000, function() {
$(this).fadeOut(2000, selfFunction);
});
}
})();
}
未经测试,但这些方面的内容应该可以解决问题。它基本上是一个遍历所有元素的回调循环。
答案 1 :(得分:0)
$(document).ready(function() {
$("div").hide();
var obj = [$("#o1"), $("#o2"), $("#o3"), $("#o4"), $("#o5")];
var i = 0;
var interval = setInterval(function() {
obj[i].fadeIn(2000);
obj[i].fadeOut(2000);
i++;
if (i > 4) {
clearInterval(interval)
}
},
4000
);
});
我很确定上面的解决方案更好,但是this would work too ..