2012-03-20 10 views
1

最新の安定版Chromeでhttp://www.framingham.edu/にアクセスした場合、「春の開始」リンクのCSS3の移行は機能しません。また、 "その他のイベント"テキストでは機能しません(ただし、その背景にある青い背景では機能します)。 Safari、Firefox、またはOperaで同じことを試してもうまくいきます。なぜこれが起こっているのか分かりません。私のCSS3がChromeのために特別に壊れているのでしょうか?奇妙なCSS3の移行...バグ?

CSS:

#events span a { 
    color: #B00932; 
    text-decoration: none; 
    -webkit-transition: color 0.6s ease-in; 
    -moz-transition: color 0.6s ease-in; 
    -o-transition: color 0.6s ease-in; 
    -ms-transition: color 0.6s ease-in; 
    transition: color 0.6s ease-in; 
} 
#events span a:hover { 
    color: #ecb220; 
    text-decoration: none; 
} 
.moreEvents { 
    text-align: center; 
    font-weight: bold; 
    padding: 10px 0; 
    background-color: #00345c; 
    -webkit-transition: background-color 0.6s ease-in, color 0.6s ease-in; 
    -moz-transition: background-color 0.6s ease-in, color 0.6s ease-in; 
    -o-transition: background-color 0.6s ease-in, color 0.6s ease-in; 
    -ms-transition: background-color 0.6s ease-in, color 0.6s ease-in; 
    transition: background-color 0.6s ease-in, color 0.6s ease-in; 
} 
.moreEvents:hover { 
    background-color: #eeb220; 
} 
.moreEvents a { 
    color: #fff; 
    -webkit-transition: color 0.6s ease-in; 
    -moz-transition: color 0.6s ease-in; 
    -o-transition: color 0.6s ease-in; 
    -ms-transition: color 0.6s ease-in; 
    transition: color 0.6s ease-in; 
} 
.moreEvents a:hover { 
    color: #000; 
} 

EDIT:zim2411以来 が、それは、ChromeとFirefoxの両方で彼のために働いていた私は、今日再びそれをしようとすることを決めた、それが働いたことを言いました!私が昨日と今日の間にしたことを考えることができる唯一のことは、すべてのブラウザなどのキャッシュをクリアしたことです。私は「Spring開始」リンクをクリックしてそのページに戻ると、移行がもう機能しないため、訪問済みリンクと何か関係があると推測しています。他の誰かがリンクを訪問した後に移行が機能しないことを確認できますか?それはまだクロムでのみ発生します...

+0

私は最新の安定したバージョンのChromeを持っていませんが、安心して、夜間に動作します:) – Ryan

+0

Windows 7のChrome 17.0.963.79 m、Firefox 11.0は私にとって効果があります。 – zim2411

+0

私は編集を行いました。私はそれがクロムの訪問されたリンクと関係があることを疑っています... – Aaron

答えて

1

私のアニメーションはすべてmoreEventsのラップに設定されています。 divにホバリングしていて、そこにラップされているタグではないため、中間に移動するまでテキストの色がアニメートされません。さらなる調査の際これが実際にどのべき既知のバグのように見える:

私の提案はEDIT

.moreEvents { 
padding:0px; 
} 
.moreEvents a { 
padding:10px 0; 
display: block; 
} 

すなわち、表示ブロック を添加しながら、より多くのイベントからのパディングを削除し、タグの上に置いていますv18で修正してください。 http://code.google.com/p/chromium/issues/detail?id=101245&q=visited%20transition&colspec=ID%20Pri%20Mstone%20ReleaseBlock%20Area%20Feature%20Status%20Owner%20Summary

+0

あなたの提案に感謝しますが、私の最近の編集をチェックしてください。奇妙な動きがあります。 – Aaron

+1

これは動作しているのを見たので、これは既知のバグであるように見えますが、私はそれを示すために私の答えを編集しました。 –

+0

ニースが見つかりました!以前はそれを見ていなかった。 – Aaron