2

CSSのみを使用してクリック時にコンテンツを表示/非表示にするためのこの単純なコードをまとめました。FFでは動作しますが、ChromeやSafariでは動作しません（IEではまだテストされていません）

http://jsfiddle.net/fW3yW/

誰かがこれらのブラウザで機能しない理由を教えて、代替案を提案できますか（可能な場合にのみCSSを使用）？

コードが使用されているサイトは次のとおりです-http://www.themontessoripeople.co.uk/montesori/?page_id =20#policies-list

4

4 に答える 4

4

tabindexを追加し、Chromeで動作します：http：//jsfiddle.net/fW3yW/1/

ここから：cssフォーカスがサファリとクロームで機能しない

jQueryメソッド： http： //jsfiddle.net/fW3yW/12/

于 2012-09-25T21:51:24.427 に答える
2

あなたはCSSを悪用しています。psuedo-classは、ブラウザが異なる方法で実装する可能性のあるリンクで:focusはなく、フォーカスのあるフォーム要素のスタイルを設定するためのものであり、同様のpsuedo-classもあります。<a>:focus:active

CSSではデフォルトで何も非表示にしないことをお勧めしますが、ロード時にjQueryを使用して要素を非表示にし、リンクがクリックされたときにjQueryを使用してアニメーションの表示/非表示を作成します（1行のコードで簡単に実行できます）。それははるかにエレガントで、より多くのブラウザで動作します。

于 2012-09-25T21:53:07.810 に答える
0

代わりにjQueryを使用してください...はるかに信頼性が高くエレガントです。

http://www.w3schools.com/jquery/jquery_hide_show.asp

于 2012-09-25T21:58:01.513 に答える
0

XHTMLDoctypeでCSS3セレクターを使用しています。すべてのブラウザがXHTMLdoctypeタグを使用してCSS3を処理するかどうかはわかりませんが、2つの仕様が必ずしも結びついているわけではありません。

HTML5を示すようにDoctypeを変更してみましたか？（もちろん、それはあらゆる種類のHTML5shimの質問を引き起こします...）

于 2012-09-25T21:52:11.223 に答える