在IE和Firefox

Question

不工作引導下拉動畫

我正在做我的使用引導程序的第一個網站，我有我的custom.css以下CSS來使我的導航欄下拉有一個奇特的動畫：

.open > .dropdown-menu { 
    -webkit-transform: scale(1, 1); 
    transform: scale(1, 1); 
    opacity:1; 
} 

.dropdown-menu { 
    opacity:3; 
    -webkit-transform-origin: top; 
    transform-origin: top; 
    -webkit-animation-fill-mode: forwards; 
    animation-fill-mode: forwards; 
    -webkit-transform: scale(1, 0); 
    display: block; 
    transition: all 0.2s linear; 
    -webkit-transition: all 0.2s linear; 
} 

我是網絡開發新手，在創建我的網站時犯了一個只在一個瀏覽器（Chrome）中測試的菜鳥錯誤。我幾乎完成了我的網站，所以我決定在其他瀏覽器中測試。我發現當我在IE和Firefox中運行網站時，下拉菜單已經打開，並且它們不能切換。

我發現刪除/評論上述CSS修復了所有瀏覽器中的問題，但我真的很喜歡這個動畫的工作。

Answer 1

那麼有針對Firefox

-ms-做，在不同的瀏覽器

-webkit-爲谷歌chrome

-moz-爲爲Internet Explorer的幾個前綴

-o-爲歌劇

在你的代碼，你可以做到這一點

.open > .dropdown-menu { 
    -webkit-transform: scale(1, 1); 
    -moz-transform: scale(1, 1); 
    -ms-transform: scale(1, 1); 
    -o-transform: scale(1, 1); 
    transform: scale(1, 1); 
    transform: scale(1, 1); 
    opacity:1; 
} 

在所有的模塊，並在關鍵幀做這個您正在使用的動畫

嘛例如你可以看這個視頻keyframes