$().animate IE ignore "bottom" value
Hello, I use this code to animate an image:
- $( "#myimage") .everyTime ( 10000, function (){
$(document).ready(function(){
$("#myimage").animate({
width: "107px",
rotate: '+=0deg',
height: "89px",
bottom: "-95px"
}, 0 );
$("#myimage").animate({
width: "0px",
rotate: '+=-58deg',
height: "0px",
marginLeft: "5.5in",
bottom: "200px"
}, 3500 );
$("#myimage").animate({
width: "0px",
rotate: '+=-302deg',
height: "0px",
marginLeft: "6.8in",
bottom: "-95px"
}, 0 );
$("#myimage").animate({
width: "0px",
rotate: '+=0deg',
height: "0px",
marginLeft: "6.8in",
bottom: "-95px"
}, 0 );
});
});
And css:
- #myimage {position:fixed;margin: 0 0 0 650px;bottom:-95px !important;}
It works fine in FF, Opera, Google chrome and Saffari but not in IE
At phase one, the image is outside the visible screen and after a while, the image comes from the botom of the screen, directing to the center while it is rotating and resizing. The only thing that doesn't work in IE is the "bottom" value. The image animation starts at the top of the screen.
Any help is welcomed.
Best regards.