Brief introduction
<abbr> is to use the abbreviation that goes up for Web page (translator notes: Part abbreviation and abbreviate here and talk, abbreviation range is bigger than abbreviate, the abbreviate that takes initial uses <acronym> label) add the XHTML label that tags appropriately, the IE browser of short duration of Windows does not bear <abbr> label. In IE, you can apply CSS to give <acronym> but cannot use <abbr> label, IE can show hint for the Title attribute of <acronym> label, but label of meeting oversight <abbr> .
The Bug of this IE (or characteristic) make personnel of a few websites thinks <abbr> label was used do not have, and apparent so consider as incorrect. Very correct still in Mozilla and Opera treated this ticket, and it is mixed to the readability of Web content semantics is changed for very important. This also is why I am seeking a means of settlement all the time, final I was found.
Means of settlement
This method is based on a simple fact: Although IE is met oversight <abbr> label, but it is normal that other nest is returned in the label in <abbr> label. So I am in embedded label of a <span> to be in <abbr> , install the Title of <span> and Class attribute, next <abbr> begins become and <acronym> label is same.
Code example
Read the code below, it is the example of a simple abbreviate word:
<abbr Title="Cascading Style Sheets">CSS</abbr>
Now, contrast the code after revising:
<abbr Title="Cascading Style Sheets"><span Class="abbr" Title="Cascading Style Sheets">CSS</span></abbr>
Automata
Manual embeds to each <abbr> label <span> is apparent impossible — already dull do not have to Mozilla and Opera again necessary. Fortunately, one each is moved now, the means of settlement that is based on a client to carry script.
You may notice, this page (translator notes: The page of former writer) although the logogram term that go up has clew in the metropolis in IE, and added CSS type (empty underline and a mouse cursor of interrogation shape) . However if you read source code, you will look for the <span> label that is less than thereinbefore to mention. This profit from a of this page to load simple JavaScript:
Var OldBodyText, newBodyText, reg
If (isIE) {
OldBodyText = Document.body.innerHTML;
Reg = /<ABBR([^>]*)>([^<]*)<\/ABBR>/g;
NewBodyText = OldBodyText.replace(reg, ‘<ABBR $1><SPAN Class=\"abbr\" $1>$2</SPAN></ABBR>’);
Document.body.innerHTML = NewBodyText;
}
}
Window.onload = Function(){
StyleAbbr()
};
This paragraph of script can check a client to carry a browser, if be IE, so the edition that replaces all <abbr> label to pass to revise (embedded <span> ) . Watchful is we must be used criterion the DOM method that expression and InnerHTML attribute will come to replace a standard, because IE cannot pass DOM,will get <abbr> property.
The style is changed
See the CSS that uses on this page finally. Quite simple:
Abbr, acronym, span.abbr {
Cursor: Help;
Border-bottom: 1px Dashed #000;
}
Mozilla and Opera use Abbr and Acronym attribute selector, IE uses Acronym and Span.abbr. Anyhow, <abbr> and <acronym> were changed by the style — the mouse cursor of an interrogation shape (point to when the mouse after going up) with empty underline.
