IE7.jsを軽く検証してみる

Web

IE7.jsはJavaScriptで開発されたMS Internet ExplorerのHTML/CSS表示を調整するライブラリ。IE7.jsを使うことでMSIEのHTML/CSSまわりの表示処理をよりW3C標準規約に準拠したものにする。IE5やIE6で透過PNGを表示できるようにもなる。


IEが標準に準拠したブラウザのように振舞ってくれるJavaScriptライブラリのようです。
以下が本家のページ。


・ie7-js
http://ie7-js.googlecode.com/


W3Cの仕様に準拠したHTML/CSSを記述して、IE7.js を読み込めば、
IEがW3C仕様に対応してしまうという訳です。


IE6で動作するHTML/CSSがIE7で動作しない問題を改善する
プロダクトを個人的には望んでいたのですが、
残念ながらそうではないようです。


今後は、W3C仕様に準拠したものを作るという、本来のあるべき姿を追求すれば、
W3C仕様におけるIEのブラウザ互換性問題は考慮しなくても良いと。
うーん、素晴らしい！！


ie7-jsの本家Webサイトによると以下の要領でJavaScriptを
読み込ませることができるようです。
（version/xx.x の xx.x の箇所は適宜変更する必要あり。
Donwnloadのリンクを辿るなどして正確なURLを確認すべし。）

<!--[if lt IE 7]>
<script src="http://ie7-js.googlecode.com/svn/version/xx.x/IE7.js" type="text/javascript"></script>
<![endif]-->


実際にサンプルコードを書いて軽く検証してみました。


このサンプルは、Child selectorsというCSSの継承について扱っています。
IE7.jsを読み込まずにIE6でこのHTMLを開くと、

<div class="child">Child</div>

の箇所の背景色がちゃんと表示されない問題が解消されることを確認することができます。

<html>
<head>
<!--[if lt IE 7]>
<script src="http://ie7-js.googlecode.com/svn/version/2.0(beta)/IE7.js" type="text/javascript"></script>
<![endif]-->

<style type="text/css">

.parent {
  margin: 1em 0.3em 0.3em;  
}

.parent > .child {
  background-color: yellow;
}
</style>
</head>
<body>
<h1>IE7.js Example</h1>
<h2>Child selectors (parent > child)</h2>

<div class="parent">Parent
  <div class="child">Child</div>
</div>

</body>
</html>


以下のページで様々なサンプルを実際に確認することができます。

・IE7 Test Page
http://ie7-js.googlecode.com/svn/test/index.html


参考：

・Cascading Style Sheets Level 2 Revision 1 (CSS 2.1) Specification
http://www.w3.org/TR/CSS21/


http://dewacity.myminicity.com/