PDA

View Full Version : Using js to implement :before & :after in IE?



Graft-Creative
May 13th, 2005, 12:44 PM
Hi all,

I was wondering if anyone knew of a script that will make IE display images using the CSS :before and :after pseudo-elements?

I've tried Dean Edward's IE7 script(s) but found it much too slow as the website in question is pretty weighty anyway.

Any suggestions or help would be very gratefully revieved :)

Kind regards,

Gary

jbot
May 13th, 2005, 04:25 PM
I was wondering if anyone knew of a script that will make IE display images using the CSS :before and :after pseudo-elements?

obviously the properties don't exist for IE, so you can't use JS to create them. what you would have to do is wrap the objects you want to have in other tags and then use those elements to include the extra content.

however, you don't need to use JS for this. you can quite easily use HTML and what's called IE conditional comments, whereby only IE sees the extra tags:



<p>
<!--[if IE]><span><img src="shim.gif" width="10" height="10"></span><[endif]-->
<strong>Hello World</strong>
<!--[if IE]><span><img src="shim.gif" width="10" height="10"></span><![endif]-->
</p>

the way you'd organise your CSS would also have to reflect the changes, so that you'd start off with W3C standard-compliant properties, followed by alternative code for IE which would also inherit the standard stuff from the main stylesheet. you'd also include an IE stylesheet in the header using the conditional comment routine. never use hacks to achieve this, because you'll end up having to recover your code later on.