2

私のサイトアドレスはhttp://applocity.blogspot.com/です

私はナビゲーション バー (ソース コードで見つけたい場合は #cssmenu) を持っていますが、奇妙な理由でこれが発生しています。しかし、背景色がフェードインとフェードアウトによって色が変わるように、トランジションを追加したかったのです。これは Chrome では正常に機能しますが、Firefox ではサブリンク (デバイスとカテゴリの下など) でのみ機能します。なぜこれが起こるのか理解できませんでした。

#cssmenu a {

background: #999999;
color: #FFF;
-webkit-transition: background 1s ease;
-moz-transition: background 1s ease;
-ms-transition: background 1s ease;
-o-transition: background 1s ease;
transition: background 1s ease;
padding: 0px 25px; 

//border-radius: 5px; (NOT ACTIVE)
}

    #cssmenu ul li:hover > a { 

background: #66FF99;
  color: #000000;
-webkit-transition: background-color 0.3s ease;
-moz-transition: background-color 0.3s ease;
-ms-transition:background 0.3s ease;
-o-transition: background-color 0.3s ease;
transition: background-color 0.3s ease;
}

(サイトのソース コードには、さらに多くの情報があります - CTRL+F #cssmenu)

私がこれまでに試したこと：

  1. 背景の代わりに背景色を入れる
  2. -moz-transition の使用...もちろん
  3. CSS コード内でトランジション属性を配置した場所 (例: #cssmenu と #cssmenu:hover.
4

1 に答える 1

1

私はそれを考え出した。これが私のソリューションへのリンクです。http://jsfiddle.net/mrytF/2/

問題は 59 ～ 61 行目から発生していました。このコードがありました：

.cssmenu a {
  -moz-transition: background 1s ease;
}

.cssmenu存在しないとき。このコードをコメントアウトしたところ、Firefox で正常に動作するようになりました。また、冗長だと思われるいくつかの CSS をコメントアウトしました。

お役に立てれば

編集

サブメニューが表示されない問題を修正しました。ここでの主な問題は、#cssmenu ul li.hover必要なときに 22 行目を としていたことです#cssmenu ul li:hover。ここにフィドルがあります

http://jsfiddle.net/mrytF/3/

于 2013-02-21T04:28:16.470 に答える