功能只適用於Chrome，但不適用於Firefox。我如何在Firefox中取代？

我在我的網站上添加了一個懸停板，翻轉顯示更多文本。它只適用於Chrome。在Firefox中，它會讓整個盒子在懸停時變成灰色。我如何讓它在Chrome中運行並且在Firefox中不做任何事情？功能只適用於Chrome，但不適用於Firefox。我如何在Firefox中取代？

我把它從這個地方是：

http://cssdeck.com/item/122/hoverboard-3d

我的網站是：

（刪除） - 將鼠標懸停在「排序依據是產品」，看看有什麼我指的是。

謝謝！

來源

2012-06-13 S. Fellig

使用火狐特定的前綴並覆蓋：與普通班懸停班。就像這樣：

@-moz-document url-prefix() { 
#hover-flip:hover p { 
    background: #fff; 
    color: #009EE0; 
    margin: -40px 0 0 0; 
    position: relative; 
} 
#hover-flip:hover { 
    border-top: 1px solid #DDD; 
    bottom: 0; 
    color: #df3e7b; 
    font-size: 14px; 
    line-height: 40px; 
    position: absolute; 
    width: 100%; 
}

}

記住這個地方在你的CSS的底部，所以它通過級聯覆蓋以前的規則。工作示例here。

來源

2012-06-13 16:07:55

你在Firefox中測試過了嗎？它不適合我 – Dipak

Jsfiddle真棒。謝謝你的提示！ –

@Dipaks，不，不過我曾經用過這個前綴，直到現在它總是爲我工作。順便說一句，你的答案看起來也不錯，也許更乾淨，所以你從我+1了;） –

複製和粘貼所有這些屬性開始-moz-

-webkit-font-smoothing: antialiased; 
-webkit-transform-origin: top; 
-webkit-transition: all .2s ease-in-out; 
-webkit-border-bottom-left-radius: 5px; 
-webkit-border-bottom-right-radius: 5px;

-webkit-是鉻/ Safari和-moz-是針對Firefox

來源

2012-06-13 16:01:14 Dipak

將所有內容都更改爲webkit。在Firefox中看起來並不像Chrome那麼好，但它確實有效！ –

功能只適用於Chrome，但不適用於Firefox。我如何在Firefox中取代？

回答

相關問題