【发布时间】:2013-07-27 15:54:44
【问题描述】:
所以我有这个 Javascript 代码块(见下文),它适用于 Firefox、Chrome 和 Safari。在 IE 中,它运行第一个动画function $(".slide1_background").animate({ yada yada yada,然后什么也没有。我尝试在它之后发出警报,但它也不会触发。
背景图片有一个单独的滑块脚本。这是一个 Joomla 模块。
网站位于here。
谁能解释一下这种情况?
$(window).load(function() {
swap();
});
function swap() { //INITIAL LOAD AND SLIDE
window.setTimeout(function() {
$(".slide1_background").animate({
left: '-=1973',
opacity: '1',
display: 'block'
}, 1000, 'easeOutBack');
$(".slide1_text").animate({
left: '-=1973',
opacity: '1',
display: 'block'
}, 1000, 'easeOutBack', function() {
$(".slide2_background").css("left","960px");
$(".slide2_text").css("left","493px");
slideInSlide2();
});
}, 9000);
};
function slideInSlide2() {
//BEGINNING OF LOOP
$(".slide2_background").animate({
left: '-=468',
opacity: '1',
display: 'block'
}, 1000, 'easeOutBack', function() {
});
window.setTimeout(function() {
$(".slide2_text").animate({
left: '-=468',
opacity: '1',
display: 'block'
}, 1000, 'easeOutBack', function() {
slideOutSlide2();
});
}, 200);
}
function slideOutSlide2() {
window.setTimeout(function() {
$(".slide2_background").animate({
left: '-=1973',
opacity: '1',
display: 'block'
}, 1000, 'easeOutBack', function() {
});
$(".slide2_text").animate({
left: '-=1973',
opacity: '1',
display: 'block'
}, 1000, 'easeOutBack', function() {
$(".slide3_background").css("left","960px");
$(".slide3_text").css("left","960px");
slideInSlide3();
});
}, 6800);
};
function slideInSlide3() {
$(".slide3_background").animate({
left: '-=468',
opacity: '1',
display: 'block'
}, 1000, 'easeOutBack', function() {
});
window.setTimeout(function() {
$(".slide3_text").animate({
left: '-=468',
opacity: '1',
display: 'block'
}, 1000, 'easeOutBack', function() {
slideOutSlide3();
});
}, 200);
}
function slideOutSlide3() {
window.setTimeout(function() {
$(".slide3_background").animate({
left: '-=1973',
opacity: '1',
display: 'block'
}, 1000, 'easeOutBack', function() {
});
$(".slide3_text").animate({
left: '-=1973',
opacity: '1',
display: 'block'
}, 1000, 'easeOutBack', function() {
$(".slide1_background").css("left","960px");
$(".slide1_text").css("left","960px");
slideInSlide1();
});
}, 6800);
};
function slideInSlide1() {
$(".slide1_background").animate({
left: '-=468',
opacity: '1',
display: 'block'
}, 1000, 'easeOutBack', function() {
});
window.setTimeout(function() {
$(".slide1_text").animate({
left: '-=468',
opacity: '1',
display: 'block'
}, 1000, 'easeOutBack', function() {
slideOutSlide1();
});
}, 200);
}
function slideOutSlide1() {
window.setTimeout(function() {
$(".slide1_background").animate({
left: '-=1973',
opacity: '1',
display: 'block'
}, 1000, 'easeOutBack', function() {
});
$(".slide1_text").animate({
left: '-=1973',
opacity: '1',
display: 'block'
}, 1000, 'easeOutBack', function() {
$(".slide2_background").css("left","960px");
$(".slide2_text").css("left","493px");
slideInSlide2(); //LOOP AGAIN
});
}, 6800);
};
【问题讨论】:
标签: jquery internet-explorer animation