html - CSS 过渡和动画在 IE 中不工作(在 Firefox/Chrome 中工作)

标签 html internet-explorer css

如何编辑我的代码以使其在 IE 中运行。它在 Firefox 和 Chrome 中运行良好。 我无法找出在 Internet Explorer 中调用 transitionanimation 的正确属性。

<html>
<head>
<title> Sample for Konstantin</title>
<style type="text/css">

.text p
{text-align:center;
margin-left:auto;
margin-right:auto;
left:50%;

}
.text {

    overflow: hidden;
    margin-bottom: 110px;
    }

.text h1 {
    color: black;
    font-family: 'footlight mt light';
    font-size: 50px;
    -webkit-animation-name: fade-in;
    -webkit-animation-duration: .9s;
    letter-spacing: -10px;

    }
    a { text-decoration:none }

    .text h1 span a {
        -webkit-transition: 0.9s ;
                color: #9C948D;
        }

        .text h1:hover span a {
            color: blue;
            }


</style>
</head>
<body>
    <center>

    <div class="text"><p><h1>This is a sample, <br />
   My Name is Matthew<br />Here is <span><a href="http://www.nba.com" >NBA Website</a>.</span><br />This is very simple<br />Here is  <span><a href="http://www.facebook.com" > Facebook!</a>.</span></h1>
</p></div>
</body></html>

编辑:是否有像 div block 之类的东西可以在 ie 中产生类似的效果?

最佳答案

IE10 是第一个支持转换的 IE。我通常要么忽略旧浏览器中的动画(旧 IE 经常 -> 旧计算机,因此动画经常断断续续)。

如果确实需要,则使用 jQuery 对其进行修补。缺点是动画颜色没有内置到 jQuery 中,因此您需要一个插件。

关于html - CSS 过渡和动画在 IE 中不工作(在 Firefox/Chrome 中工作),我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/8580392/

相关文章:

javascript - JS - 为与 querySelectorAll 匹配的所有元素添加单击事件监听器

css - IE8和溢出

javascript - IE9 中的 Backbone 收集错误

html - 如何使用 BEM 方法为自适应网页构建 css?

javascript - 自动完成不适用于 javascript 生成的输入字段

javascript - 如何使用静态 block 实现整页滚动?

html - 如何为同一个元素分配不同的类?

php - 从 MySQL 解析多行并插入到 HTML 表中

html - 电子邮件正文中的超链接在浏览器中有效,但在 Gmail 移动应用程序中无效

html - -webkit-appearance 在 CSS3 和 IE 中等效