jQuery的动画脚本运行在IE中只有第一个动画功能 [英] jQuery animation script runs only first animation function in IE
本文介绍了jQuery的动画脚本运行在IE中只有第一个动画功能的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
所以我有此Javascript code座（见下文），它在火狐，Chrome和Safari的作品。在IE浏览器，它运行的第一个动画函数$（。slide1_background）。动画（{亚达内容十分重要，然后什么都没有。我试过之后和韩元将警报T火无论是。
有对背景图像的单独滑块脚本。这是一个Joomla模块。
该网站位于这里。
任何人都可以摆脱任何光线在这种情况呢？
$（窗口）.load（函数（）{
交换（）;
}）;函数swap（）{//初始加载和幻灯片
window.setTimeout（函数（）{
$（。slide1_background）。动画（{
左： - = 1973年，
不透明度：'1'，
显示：'块'
}，1000，easeOutBack'）; $（。slide1_text）。动画（{
左： - = 1973年，
不透明度：'1'，
显示：'块'
}，1000，easeOutBack'，函数（）{
$（。slide2_background）的CSS（左，960像素）;
$（。slide2_text）的CSS（左，493px）;
slideInSlide2（）;
}）;
}，9000）;
};功能slideInSlide2（）{
// BEGINNING LOOP的
$（。slide2_background）。动画（{
左： - = 468'，
不透明度：'1'，
显示：'块'
}，1000，easeOutBack'，函数（）{ }）; window.setTimeout（函数（）{
$（。slide2_text）。动画（{
左： - = 468'，
不透明度：'1'，
显示：'块'
}，1000，easeOutBack'，函数（）{
slideOutSlide2（）;
}）;
}，200）;
}功能slideOutSlide2（）{
window.setTimeout（函数（）{
$（。slide2_background）。动画（{
左： - = 1973年，
不透明度：'1'，
显示：'块'
}，1000，easeOutBack'，函数（）{ }）; $（。slide2_text）。动画（{
左： - = 1973年，
不透明度：'1'，
显示：'块'
}，1000，easeOutBack'，函数（）{
$（。slide3_background）的CSS（左，960像素）;
$（。slide3_text）的CSS（左，960像素）;
slideInSlide3（）;
}）;
}，6800）;
};功能slideInSlide3（）{
$（。slide3_background）。动画（{
左： - = 468'，
不透明度：'1'，
显示：'块'
}，1000，easeOutBack'，函数（）{}）;window.setTimeout（函数（）{
$（。slide3_text）。动画（{
左： - = 468'，
不透明度：'1'，
显示：'块'
}，1000，easeOutBack'，函数（）{
slideOutSlide3（）;
}）;
}，200）;
} 功能slideOutSlide3（）{
window.setTimeout（函数（）{
$（。slide3_background）。动画（{
左： - = 1973年，
不透明度：'1'，
显示：'块'
}，1000，easeOutBack'，函数（）{ }）; $（。slide3_text）。动画（{
左： - = 1973年，
不透明度：'1'，
显示：'块'
}，1000，easeOutBack'，函数（）{
$（。slide1_background）的CSS（左，960像素）;
$（。slide1_text）的CSS（左，960像素）;
slideInSlide1（）;
}）;
}，6800）;
};功能slideInSlide1（）{
$（。slide1_background）。动画（{
左： - = 468'，
不透明度：'1'，
显示：'块'
}，1000，easeOutBack'，函数（）{ }）; window.setTimeout（函数（）{
$（。slide1_text）。动画（{
左： - = 468'，
不透明度：'1'，
显示：'块'
}，1000，easeOutBack'，函数（）{
slideOutSlide1（）;
}）;
}，200）;
}功能slideOutSlide1（）{
window.setTimeout（函数（）{
$（。slide1_background）。动画（{
左： - = 1973年，
不透明度：'1'，
显示：'块'
}，1000，easeOutBack'，函数（）{ }）; $（。slide1_text）。动画（{
左： - = 1973年，
不透明度：'1'，
显示：'块'
}，1000，easeOutBack'，函数（）{
$（。slide2_background）的CSS（左，960像素）;
$（。slide2_text）的CSS（左，493px）;
slideInSlide2（）; // LOOP AGAIN
}）;
}，6800）;
};
解决方案
window.setTimeout.live（函数（）{
尝试
So I have this Javascript code block (see below), and it works in Firefox, Chrome, and Safari. In IE, it runs the first animation function $(".slide1_background").animate({ yada yada yada and then nothing. I tried putting an alert after it and that won't fire either.
There is a separate slider script for the background image. It's a Joomla module.
The site is located here.
Can anyone shed any light on this situation?
$(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);
};
解决方案
window.setTimeout.live(function() {
try that
这篇关于jQuery的动画脚本运行在IE中只有第一个动画功能的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
查看全文
