1

我为网站上的徽标添加了淡入效果：

#logo img {
    opacity: 0;
    -moz-transition: opacity 5s; /* Firefox 4 */
    -webkit-transition: opacity 5s; /* Safari and Chrome */
    -o-transition: opacity 5s;
    transition: opacity 5s;
}

和

<div id="logo"><p><a href="index.html"><img src="img/logo.png" ... onload="this.style.opacity='1';" /></a></p></div>

乍一看，它似乎工作得很好。但是在第二（第三，...）页面上，徽标只是显示，它不会在 IE9 或 FireFox 19 或 Opera 12 中淡入 - 仅在 Safari 5 和 Chrome 25 中，淡入效果适用于每一页。

我几乎从不做网页设计，这是我在玩 CSS 时偶然发现的一个很好的功能。我认为开始学习如何使用像 jQuery 这样的大型库是不合适的，我每年会使用不到一次。

是否有一种简单的方法可以使其与所有页面上的其他浏览器一起使用？

4

1 回答 1

0

根据您的评论，这可能有效：

 animation: fadein 2s;
-moz-animation: fadein 2s; /* Firefox */
-webkit-animation: fadein 2s; /* Safari and Chrome */
-o-animation: fadein 2s; /* Opera */

如果你想支持 IE，你应该使用 jQuery。

于 2013-03-14T08:02:53.997 回答