記事タイトルのような機能が無かったため、機能追加したものを作成。
https://bitbucket.org/temp_impl/ie9-js/src
オリジナルとの差分
https://bitbucket.org/temp_impl/ie9-js/commits/124d43c6f6d12327aa0c8e20775ba6a106ea2de0
「class に 対象クラス名が含まれているか」で判定しているので、クラス名が複数あってもOK。
解析されて javascript 適用のスタイルシートになると、そのままでは DHTML で使えないなどの問題が起こったりする。
また、ファイルサイズが大きい css を無視できると、当然レスポンスが良くなる。
IE7/IE8 に対応している jquery-ui の css など。
https://bitbucket.org/temp_impl/ie9-js/src
オリジナルとの差分
https://bitbucket.org/temp_impl/ie9-js/commits/124d43c6f6d12327aa0c8e20775ba6a106ea2de0
使用方法
<style> や <link> に class="ie9js-ignore" を付けると、スタイルシート解析の対象外になる。「class に 対象クラス名が含まれているか」で判定しているので、クラス名が複数あってもOK。
<html>
<head>
<!-- スタイルシート解析から無視される -->
<link type="text/css" rel="stylesheet" href="style.ignore.css" class="ie9js-ignore" />
<style type="text/css" class="ie9js-ignore">
div > div:first-child {
background-color: cyan;
}
</style>
<!-- スタイルシート解析される -->
<link type="text/css" rel="stylesheet" href="style.css" />
<style type="text/css">
div > div:last-child {
background-color: yellow;
}
</style>
<!--[if lt IE 9]>
<script src="IE9.min.js"></script>
<![endif]-->
</head>
<body>
<div>
<div>first</div>
<div>last</div>
</div>
</body>
</html>
使いどころ
対象ブラウザ(IE7/IE8)で元から使えるスタイルシートは解析させる必要がないので無視できる。解析されて javascript 適用のスタイルシートになると、そのままでは DHTML で使えないなどの問題が起こったりする。
また、ファイルサイズが大きい css を無視できると、当然レスポンスが良くなる。
IE7/IE8 に対応している jquery-ui の css など。
0 件のコメント:
コメントを投稿