此动画在 Firefox 中运行良好,但在 IE 中,当您第一次将鼠标悬停在 div 上时,它会运行动画的第一部分,而在第二次将鼠标悬停在 div 上时,它会运行动画的第二部分。我需要它们同时运行。
有什么想法吗?
$(document).ready(function() {
$("#test1").hover(
function() {
$(this).animate({
width: "599px",
left: "0px",
height: "168px",
//backgroundColor: "#d7df23",
opacity: 0.95,
borderWidth: "0px"
}, 100).css("z-index", "10");
$(this).find(".thumb").animate({
width: "150px",
height: "150px",
marginTop: "8px",
marginRight: "0px",
marginBottom: "0px",
marginLeft: "12px",
borderColor: "#FFF"
}, 100).attr('src','images/home/animatedMenu/brochureRequestIMG.jpg');
}, function() {
});
});
最佳答案
得到答案...
$(document).ready(function() {
$("#test1").hover(
function() {
$(this).animate({
width: "599px",
left: "0px",
height: "168px",
opacity: 0.95
}, 100).css("z-index", "10");
$(this).find(".thumb").animate({
width: "150px",
height: "150px",
marginTop: "8px",
marginRight: "0px",
marginBottom: "0px",
marginLeft: "12px"
}, 100).attr('src','images/home/animatedMenu/brochureRequestIMG.jpg');
}, function() {
});
});
问题在于边框样式...它们在 IE 中破坏了它。
关于jquery 动画在 IE 中的行为不同,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/3923107/