Sidebar Sidebar
Become a MacRumors Supporter for $50/year with no ads, ability to filter front page stories, and private forums.

Issue with IE 10 - conditional code ignored

Nermal

Nermal

Moderator
Original poster
Staff member
Dec 7, 2002
20,632
3,987
New Zealand
Hi,

I have a web app that uses the pointer-events CSS property to provide a "nice to have" but non-essential feature. pointer-events is part of CSS 4 and is supported in all major browsers except for IE.

My app uses <!--[if lte IE 9]> conditional code to disable this optional feature if the user is running IE (without this, the app is unusable due to the way the elements are layered). I changed this to <!--[if lte IE 10]> but that doesn't work in IE 10; it's just ignored. I've also tried just <!--[if IE]> and while that works in 6 through 9, it still doesn't work in 10.

How do I set up conditional code in IE 10? Google for "if lte IE 10" is being no help at all so I wonder whether I'm missing something blatantly obvious.

Any suggestions?

Thanks :)
 
SrWebDeveloper

SrWebDeveloper

macrumors 68000
Dec 7, 2007
1,871
3
Alexandria, VA, USA
Did you include "<![endif]-->" ? I don't see it in your post above. If so...

Conditional comments first appeared in Microsoft's Internet Explorer 5 browser and are supported through to version 9. Microsoft has announced that support has been discontinued in Internet Explorer 10 when processing HTML5 pages, but older pages using the technique will continue to work
Click to expand...
(various sources)

There are different approaches you can take, for example:

Link stylesheets based on IE type:

<!--[if gt IE 9]>
<link href="ie10_or_later.css" rel="stylesheet">
<![endif]-->

or set an HTML class based on IE version so you can easily make variances in your existing stylesheet (this method validates, too):

<!--[if lt IE 7 ]> <html class="ie6"> <![endif]-->
<!--[if IE 7 ]> <html class="ie7"> <![endif]-->
<!--[if IE 8 ]> <html class="ie8"> <![endif]-->
<!--[if IE 9 ]> <html class="ie9"> <![endif]-->
<!--[if (gt IE 9)|!(IE)]><!--> <html> <!--<![endif]-->

Or hack the CSS using "\9" if it's a single style you need adjusted, example:

.whatever {
background: gray; /* standard */
background: pink\9; /* IE 9 and below */
}

Please note any time you apply a CSS hack there is a chance it won't be supported in the future, and it may fail validation. I only added this for special situations.
 
Nermal

Nermal

Moderator
Original poster
Staff member
Dec 7, 2002
20,632
3,987
New Zealand
Yes, I have <![endif]--> in my code; my previous message was an overview of what I'm doing and is not a complete code sample :)

That information you quoted states that CCs are no longer supported in IE 10 (it's an HTML 5 page). That would explain why it's no longer working. Therefore most of your samples won't work either!

I could try a CSS hack although as you say it is just that, a hack. I'll have a think and see whether there's any way that I can restructure the page so that pointer-events isn't required, therefore bypassing the problem in the first place.

Thanks for your help.
 
SrWebDeveloper

SrWebDeveloper

macrumors 68000
Dec 7, 2007
1,871
3
Alexandria, VA, USA
Look closer please. Follow the logic of each sample - it merely exploits what you CAN do to accomplish what you WANT it to do in a workaround manner. :) Sample does not mean work as is - I am demonstrating concepts. Edit to suit your needs.

In any case, you'll find something eventually now that you know what's supported and some various techniques to fiddle with. If someone else reading this has a better idea, I'm all eyes!
 
You must log in or register to reply here.
Register on MacRumors! This sidebar will go away, and you'll see fewer ads.
Top Bottom