cssの実現:.htcファイル

12639 ワード

効果:マウスが文字を滑ると色が変わります
注意の問題:htcはIEブラウザでしか使用できない(IE 5.5以上)火狐ブラウザではサポートされていない
基礎知識:マイクロソフト(R)Internet Explorer 5で紹介されているように、HTMLコンポーネント(HTCs)は、動的HTML(DHTML)動作としてスクリプトを使用してコンポーネント機能を実現するメカニズムを提供しています.以htc拡張子保存、1部のHTCは1部のスクリプトと1組の用を含みます
コンポーネントのHTC特殊要素を定義するHTMLファイルです.このセクションには、関連する要素とサポートされているメンバーが含まれます.
オブジェクトdocumentは、指定されたブラウザウィンドウでHTMLドキュメントを表現します.elementは、プライマリドキュメント内の接続動作のラベルの参照を返します.PUBLIC:ATTACHは、イベントに関数をバインドするため、イベントが特殊なオブジェクトに発生するたびに関数が呼び出されます.PUBLIC:COMPONENTは、ファイルの内容をHTCで示します.PUBLIC:DEFAULTSはHTCのデフォルト属性を設定します.PUBLIC:EVENTは、HTCを含むドキュメントに露出させるHTCのイベントを定義します.PUBLIC:METHODは、HTCを含む文書に露出させるHTCの方法を定義する.PUBLIC:PROPERTYは、HTCを含むドキュメントに露出させるHTCのプロパティを定義します.
メソッドcreateEventObjectは、PUBLIC:EVENT要素にイベント付加情報を渡すfireメソッドが必要な場合に使用されるイベントオブジェクトを作成します.
イベントoncontentreadyが動作を接続した要素の内容が完全に解析されたときに発生します.oncontentsaveは、要素の動作を接続した要素の内容が保存またはコピーされる前に発生します.ondetachは、1つの要素から動作の接続を解除する前に発生します.ondocumentready動作を含むドキュメントが完全に解析されたときに発生します.
次に私の手順を説明します.
1.htcファイルの作成(hilite.htc)
  HTC  <PUBLIC:COMPONENT> <PUBLIC:ATTACH EVENT="onmouseover" ONEVENT="Hilite()"/> <PUBLIC:ATTACH EVENT="onmouseout" ONEVENT="Restore()"/> <SCRIPT LANGUAGE="JScript"> var normalColor, normalSpacing; functionHilite() { // save original values normalColor = runtimeStyle.color; normalSpacing= runtimeStyle.letterSpacing; runtimeStyle.color ="red"; runtimeStyle.letterSpacing =2; } functionRestore() { // restore original values runtimeStyle.color = normalColor; runtimeStyle.letterSpacing = normalSpacing; } </SCRIPT> </PUBLIC:COMPONENT>2.テストページの作成(WebForm 1.aspx)HTML  <%@PageLanguage="C#"AutoEventWireup="true"CodeBehind="WebForm1.aspx.cs"Inherits="WebApplication3.WebForm1"%> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head runat="server"> <title> </title> <style type="text/css"> LI { behavior: url(hilite.htc); } </style> </head> <body> <form id="form1" runat="server"> <ul> <li> </li> <li>homepage.yesky.com</li> </ul> </form> </body> </html> 
 
 
ソース:<http://www.cnblogs.com/zhwl/archive/2011/02/28/1967176.html>