爲什麼在頁面加載時執行轉換？

我有了一個過渡的CSS導航菜單：爲什麼在頁面加載時執行轉換？

nav { 
    height: 700px; 
    width: 100%; 
    background-color: rgb(158, 165, 177); 
    position: relative; 
    margin-top: -622px; 
    -webkit-transition: margin .4s cubic-bezier(1,-0.29,.76,1.32); 
     -moz-transition: margin .4s cubic-bezier(1,-0.29,.76,1.32); 
     -ms-transition: margin .4s cubic-bezier(1,-0.29,.76,1.32); 
     -o-transition: margin .4s cubic-bezier(1,-0.29,.76,1.32); 
      transition: margin .4s cubic-bezier(1,-0.29,.76,1.32); 

} 

.show-nav { 
    margin-top: -100px; 
}

我使用jQuery來觸發它：

$('nav').click(function(e) { 
    e.preventDefault(); 
    $(this).toggleClass('show-nav'); 
});

的問題是，每一次頁面加載我看到了利潤率轉變爲如果它有show-nav類，然後刪除。

這是爲什麼？

來源

2012-09-30 ilyo

轉換髮生在選擇器匹配上，而不是在刪除時發生。 –

看看這個（相當廣泛的）答案與示範：http://stackoverflow.com/a/12489271/451969 –

@Jared Farrish我不知道這是什麼意思關於我的問題 – ilyo

爲什麼不把轉換放在css中的.show-nav聲明中？

來源

2012-09-30 14:32:48 erik

因爲我希望在添加和刪除此類時發生這種情況 – ilyo

@IlyaD - 如果您希望它們反應如此，請爲您的轉換創建另一個類（可能是'.transition'），然後添加/刪除該類名有必要的。我不會把它放在元素選擇器上的頁面加載元素上，就像'nav'一樣。 –

爲什麼在頁面加載時執行轉換？

回答

相關問題