After observing that most of my visitors (45% currently) use Internet Explorer, I’ve made a little modification so that they to can enjoy the <q> tag. A more detailed discussion and other solutions can be found at the List Apart site. I’ll only present in short my version.
My version consists of two parts: a style using the underscore hack to make the contents of the tag italic for the security conscious users (those who don’t have Javascript enabled) and then a script written in unobtrusive style which (a) adds a " before and after each tag and (b) disables the italic style. You can find the sources below.
GeSHi © 2004, Nigel McNie
-
<style type=“text/css”><!–
-
Q { _font-style: italic; }
-
–></style>
GeSHi © 2004, Nigel McNie
-
var quoteResolver = {
-
addEvent : function (obj, evType, fn) {
-
//taken from: http://www.scottandrew.com/weblog/articles/cbs-events
-
if (obj.addEventListener){
-
obj.addEventListener(evType, fn, false);
-
return true;
-
} else if (obj.attachEvent){
-
var r = obj.attachEvent(“on”+evType, fn);
-
return r;
-
} else {
-
return false;
-
}
-
},
-
-
doWork: function () {
-
//add a ” before and after each q
-
var qs = document.getElementsByTagName(‘q’);
-
for (var i = 0; i < qs.length; i++) {
-
var before = document.createTextNode(‘”‘);
-
var after = document.createTextNode(‘”‘);
-
qs[i].parentNode.insertBefore(before, qs[i]);
-
qs[i].parentNode.insertBefore(after, qs[i].nextSibling);
-
}
-
-
//deactivate the font-style: italic rule
-
for (var i = 0; i < document.styleSheets.length; i++) {
-
//the standard would be cssRules, but IE uses rules
-
//and we are targeting IE only
-
var ruleList = document.styleSheets[i].rules;
-
for (var j = 0; j < ruleList.length; j++)
-
if (‘Q’ == ruleList[j].selectorText && ‘italic’ == ruleList[j].style.fontStyle) {
-
//this is the style we wish to disable
-
ruleList[j].style.fontStyle = ”;
-
break;
-
}
-
}
-
},
-
-
init : function () {
-
//try to determine if this is an IE browser
-
var userAgent = /MSIE/; var nonUserAgent = /Opera/; var os = /Windows/;
-
if ( userAgent.exec(navigator.userAgent) && !nonUserAgent.exec(navigator.userAgent) && os.exec(navigator.userAgent) ) {
-
//register a function to do the work after we finish loading
-
this.addEvent(window, ‘load’, this.doWork);
-
}
-
}
-
}.init();