爲什麼轉換是通過自動對焦啓動的？

我創建了一個使用autofocus="autofocus"的聯繫表。我注意到奇怪的事情，當表單自動對焦時，我的導航欄上的轉換就會啓動。我只在Firefox中注意到它。有沒有我做錯了什麼，或者它只是如何firefox的行爲（錯誤）？爲什麼轉換是通過自動對焦啓動的？

With autofocus（刷新頁面）
Without autofocus

FORM：

<form method="post" action="" id="contactForm"> 
    <textarea id="contactF" name="message" tabindex="1" placeholder="Type your message here" required="required"></textarea> 
    <input type="submit" id="contactS" name="submit" value="Send" tabindex="3" /> 
    Your Name: <input type="text" id="contactN" name="name" tabindex="2" placeholder="Type your Name" required="required" /> 
</form>

CSS的導航：

#menu ul li { 
    width: 251px; 
    text-align:center; 
    display: inline-block; 
    background: #ddd; 
    height: 30px; 
    line-height: 30px; 
    box-shadow: 126px 0 0px 0px #000 inset, -126px 0 0px 0px #000 inset; 
    -webkit-transition: all 400ms ease-in; 
    -moz-transition: all 400ms ease-in; 
    -o-transition: all 400ms ease-in; 
    transition: all 400ms ease-in; 
} 

} 

#menu ul li:hover, #menu li.active { 
    box-shadow: 0 0 0px 0px #000 inset, -0 0 0px 0px #000 inset; 
} 

#menu ul a:link,#menu ul a:visited { 
    display: block; 
    font-size: 17px; 
    width: 251px; 
    text-decoration: none; 
    font-weight: bold; 
    color: #6DB7B5; 
    margin:0 auto; 
    -webkit-transition: all 400ms ease-out; 
    -moz-transition: all 400ms ease-out; 
    -o-transition: all 400ms ease-out; 
    transition: all 400ms ease-out; 
} 

#menu ul a:hover, #menu li.active a { 
    color: #FF6181; 
}

來源

2013-05-04 Dharman

這兩種情況都顯示我相同的行爲（火狐20.0.1，WIN 7） – CBroe 2013-05-04 19:23:23

沒有與自動對焦動畫被激發起來。 – 2013-05-04 19:23:56

我認爲這個問題與Firefox的速度有關。我使用firefox 20.0.1 Win 7 – Dharman 2013-05-04 19:53:35

好了新的嘗試，一些閱讀後，我發現這可能是一個轉型的一般問題。如果發生這種情況只有一個修復。

你有一類在所有

.preload * { 
    -webkit-transition: none !important; 
    -moz-transition: none !important; 
    -ms-transition: none !important; 
    -o-transition: none !important; 
}

添加到您的身體

<body class="preload">

這個類就沒有得到轉變而在最後，你必須有一個小JS刪除預緊類。

$("window").load(function() { 
    $("body").removeClass("preload"); 
});

希望這有助於反饋將是很好

來源

2013-05-04 19:53:25

但是這會改變輸出。它不會像現在顯示的那樣顯示。 – Dharman 2013-05-04 19:55:39

對不起，有點晚...看着它。 – 2013-05-04 20:06:26

它的工作原理，所以我記得它是一個Firefox的錯誤，對吧？ – Dharman 2013-05-07 13:17:23

爲什麼轉換是通過自動對焦啓動的？

回答

相關問題