IE6-8で疑似クラスを使いたい
いつもお世話になっています。
やりたいことは、以下のサイトのアコーディオンメニューです。
http://weboook.blog22.fc2.com/blog-entry-347.html
上記サイトをIE8でみると、問題なく表示されるのですが、
自分が作成したHTMLをIE8で確認すると、Webフォントで
指定した矢印が表示されません。(その他ブラウザはOK)
Webフォントそのものは、メニュー以外の場所で表示される
ことを確認したのですが、メニュー内では表示できませんでした。
このことから、原因は疑似クラスのafterが効いていないと推測
しています。
上記サイトで疑似クラスを使うためにjQueryを読み込ませている
のだと認識していたのですが、違うのでしょうか。
IE6-8で疑似クラスを使用させるためのjs(selectivizr)をダウンロード
してきてみたのですが、それでもうまくいきません。
WEBサーバーになにか仕込まないといけないなどあるのでしょうか。
どのようにすれば疑似クラスを使用できるかご教示お願いいたします。
-----------------------------------------------------------
HTML(ヘッダーへの指定部分)
-----------------------------------------------------------
<head>
<title>タイトル</title>
<meta http-equiv="Content-Type" content="text/html;charset=Shift_JIS">
<link rel="stylesheet" href="../css/common.css" type="text/css" />
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script type="text/javascript" src="[JS library]"></script>
<!--[if (gte IE 6)&(lte IE 8)]>
<script type="text/javascript" src="../js/selectivizr.js"></script>
<noscript><link rel="stylesheet" href="[fallback css]" /></noscript>
<![endif]-->
<script type="text/javascript">
$(function() {
$("#accordion li ul").hide();
$("#active").show();
$("#accordion > li > a").click(function(){
var click = $("+ul",this);
click.slideDown();
$("#accordion ul").not(click).slideUp();
$(".arrow").removeClass("rotate");
$("> .arrow",this).addClass("rotate");
return false;
});
});
</script>
</head>
お礼
回答ありがとうございます。 JavaScript使うのも、フレーム使うのも似たようなもの、なんですか。 だったらフレームのほうが簡単かな、と思いました。 未対応ブラウザ向けにはサイトマップのような形で別ページを設定しようと思っています。