Thursday, September 16, 2010

Internet Explorer Conditional Comments

With Internet Explorer Conditional Comments, one can hide HTML code from Internet Explorer, or reveal code only to Internet Explorer. The conditional comment code consists of Internet Explorer's proprietary code within HTML comments. Since the proprietary code is within conditional comments, it is hidden from all other browsers. IE Conditional Comments does not cause a page to become invalid.

Example 1:
<!--[if IE]>
<p>You are an Internet Explorer user.</p>
<![endif]-->

In the above example, the p element only appears in Internet Explorer. All other browsers treat the entire piece of code as an HTML comment.

Specific versions of Internet Explorer or all versions above or below a particular version can be targeted using operators

Example 2:
<!--[if lte IE 7]>
<p>You are using an outdated version of Internet Explorer.</p>
<![endif]-->

In the above example, lte is the operator. It stands for "less than or equal to".

Here is a list of Operators and their meanings

OperatorMeaningExample
!The NOT operator<!--[if !(IE 9)]>
ltThe less-than operator<!--[if lt IE 9]>
lteThe less-than-or equal to operator<!--[if lte IE 8]>
gtThe greater-than operator<!--[if gt IE 8]>
gteThe greater-than-or equal to operator<!--[if gte IE 8]>
&The AND operator<!--[if (lte IE 8)&(gte IE 6)]>
|The OR operator<!--[if (IE 8)|(IE 6)]>

To hide HTML code from Internet Explorer, use the format shown below:

Example 3:
<!--[if !IE]><!-->
<p>You are not using Internet Explorer.</p>
<!--><![endif]-->

To hide HTML code from only certain versions of Internet Explorer, use the format shown below:

Example 4:
<!--[if IE 9]><!-->
<p>You are using a modern browser.</p>
<!--><![endif]-->

More information can be found at MSDN.

No comments: