4

リンクの上にカーソルを合わせると、タイトルがフレームの外にスライドし、別の単語がスライドインするメニューを作成しました (クライアントの要求)。これを CSS のみで実行しようとしていますが、Chrome では期待どおりに動作しますが、Firefox や Opera では動作しません。2 番目のアニメーション (別の単語がスライドインする場所) のみが機能しますが、プライマリ アニメーション (通常の単語がスライドアウトする場所) にはトランジションが適用されません。例を含む jsFiddle を次に示します。

http://jsfiddle.net/3tUAN/

必要に応じて jQuery を使用することもできます (コードはあり、IE9 には既に必要です) が、可能であれば、これを CSS のみで機能させたいと考えています。セレクターをより具体的にしようと考えましたが (子セレクターのようなものを使用a.MenuLink > li.MenuItem > span.MenuTitle)、コミュニティがこれについて助けてくれることを望んでいました。

4

1 に答える 1

4

leftの初期値を指定する必要がありますspan.MenuTitle。これは他のブラウザのバグかもしれませんが、Firefoxでは修正されています。このようなもの：

span.MenuTitle {
    left: 0;
}

このjsFiddleを参照してください

于 2013-02-12T16:40:34.943 に答える