IEのConditional Comments(条件付コメント)
September 30, 2014
たまに必要な時があったりして、しかし、ほんとにたまになので、どこにブックマークしたかが分からなくなってしまう事があるので、自分用覚書です。
CSS-TRICKS様の「How To Create an IE-Only Stylesheet」に書かれているConditional Comments(条件付コメント)の方法が良く効きます。
また、これまでIEのConditional Commentsは、<head>内にしか入れられないのかと思っていましたが、<body>内のhtmlにも直接入れる事が出来るのですね。
今、jQueryでヘッダーの高さを割り出して、それをcssのbody要素に指定してあるbackgroundのpositionにその高さを当てはめる件をしていて、IE7でだけスペースが無く、なので、IE7の分にだけ高さを余分に取りたかったので、このIEのConditional CommentsとjQueryとMTタグのセットでうまく行きました。助かりました。
コードとしては、こんな感じです。(<>は全角にしています。)(jQueryはIE6から対応なので、IE6以下のバージョン判別はここではしていません。)
<MTSetVarTemplate name="header_height_ie7_except">
<script type="text/javascript">
var header_height = $('#header .text-info').height() + 5;
$('#header').height(header_height);
var position_value = "left " + header_height + "px";
$('body').css('background-position', position_value);
</script>
</MTSetVarTemplate>
<MTSetVarTemplate name="header_height_ie7">
<script type="text/javascript">
var header_height = $('#header .text-info').height() + 20;
$('#header').height(header_height);
var position_value = "left " + header_height + "px";
$('body').css('background-position', position_value);
</script>
</MTSetVarTemplate>
<!--[if IE 6]>
<MTGetVar name="header_height_ie7_except">
<![endif]-->
<!--[if IE 7]>
<MTGetVar name="header_height_ie7">
<![endif]-->
<!--[if gte IE 8]>
<MTGetVar name="header_height_ie7_except">
<![endif]-->
<!--[if !IE]><!-->
<MTGetVar name="header_height_ie7_except">
<!--<![endif]-->
最新記事
- MTで検索タイムアウトが発生した場合
- MT7で新しいサイトを作るとき (自分用覚書)
- MT テーマのエクスポート時にファイルも選択する際、ファイル内に文字化けファイルがあるとエラー(自分用覚書)
- もしかして半身浴のお陰?花粉症の症状が出ません
- Hiromi: The Trio Project featuring Anthony Jackson
- Juneuary Weather 一気に寒く
- ローズガーデン at Burnaby Mountan
- やっとPRカード申請書を郵送
- きんぴらいなり寿司
- PRカードの更新・・!
- 今日の風景
- 5年前のちょうどこの時間帯に
- もうすぐ新年!
- ビクトリア北でM4.8の地震
- 中抜き化が進みつつある