将CSS3动画转换为JQuery以用于IE8及更高版本 [英] Convert CSS3 animation into JQuery for use in IE8 and above

问题描述

我发布了此问题昨天和以后5个或多个小时的战斗与IE8只是隐藏叠加文本，在转换发生之前，我已经决定，唯一的方法来解决这个问题是将其转换为JQuery。我有一个css动画，我需要切换到jquery或javascript，因为IE8显示覆盖文本之前 hover 发生。由于CSS相当冗长，我做了这个 JSFiddle 。 css转换发生在25和44行。

I posted a this question yesterday and after 5 or more hours of fighting with IE8 just to hide the overlay text before the transition happened, I have decided that the only way to fix the issue is to convert it to JQuery. I have a css animation that I need to change over to jquery or javascript because IE8 displays the overlay text before the hover occurs. Because the CSS is quite lengthy I made this JSFiddle. The css transitions occur on lines 25 and 44.

推荐答案

在这里，你可以修改数字。我没有IE，所以我不能测试它，但它应该是好的：

Here you go, you can tinker with the numbers if you want. I don't have IE so I can't test it but it should be good:

$(".cascade-t1").hover(function(){
    $(".cascade-corner").fadeOut();
    $(".overlay-t1").animate({"left": "-300px"}, 300, function(){
        $(".cascade-overlay-content").fadeIn(200);    
    });


}, function(){

   $(".cascade-corner").fadeIn();
   $(".cascade-overlay-content").fadeOut(200, function(){
       $(".overlay-t1").animate({"left": "130px"}, 300);    
    });

});

JSFIDDLE

这篇关于将CSS3动画转换为JQuery以用于IE8及更高版本的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！