スタイルシートで動きをつける(2)
IE5.0より導入されたHTC(HTML Components)を使って、スタイルシートに記述したタグの振る舞い(behavior)を
JavaScriptやVBScriptなどで記述することができます。(IE5より)
以下のように同じフォルダ内にtest.cssとtest.htcとtest.htmというファイルを作ります。
ファイル名:test.css
body { behavior:url(test.htc)}
|
【説明】
<body>のbehavior(振る舞い)を、test.htcに任せます。
ファイル名:test.htc
<public:component>
<script language="Javascript">
attachEvent("onclick",Click_Sub);
function Click_Sub() {
alert(event.srcElement.tagName);
}
</script>
</public:component>
|
【説明】
attachEventでonclickを取得します。
振る舞いに対して(ここではonclickに対して)、動作を記述します。
ファイル名:test.htm
<html>
<link rel="stylesheet" type="text/css" href="test.css">
<body>
<div>ここをクリックしてください。</div>
<span>ここをクリックしてください。</span>
<b>ここをクリックしてください。</b>
</body>
</html>
|
【説明】
クリックされたタグ名が表示されます。
サンプル
関連リンク
スタイルシートとは
スタイルシートの作り方
スタイルシートで使用できる属性
スタイルシートで複数の属性を設定する
スタイルシートでクラスを設定する
スタイルシートで動きをつける(1)
スポンサードリンク
| |