A simple JS mouse across the switch effect _javascript skills

Last time to help a friend wrote a simple switch effect, super simple, but also more applicable. Because of the CSS sprite technology, the demo comes with IE6-compatible PNG JS.

Core JavaScript code: Click here to view demo

Copy Code code as follows:

@Mr. To get the object property compatibility method
function $ (objectId) {
if (document.getElementById && document.getElementById (objectId)) {
return document.getElementById (OBJECTID);//The Consortium DOM
else if (document.all && document.all (objectId)) {
return document.all (OBJECTID);//MSIE 4 DOM
else if (document.layers && Document.layers[objectid]) {
Return document.layers[objectid];//NN 4 DOM. This is won ' t find nested layers
} else {
return false;
}
}
@Mr. See toggle display text and background map position
function Ileftnav (type) {
var inum,i_navinfo=$ ("I_navinfo");
if (type== "Writeblog") {
Inum= " -300px";
}else if (type== "Sharepic") {
Inum= " -600px";
}else if (type== "Writemsg") {
Inum= " -900px";
}else{
Inum= " -300px";
}
i_navinfo.innerhtml=$ (type). InnerHTML;
i_navinfo.style.backgroundposition=inum+ "0";
}
@Mr. Do you load mouse over events
Window.onload=function () {
var liitem=$ ("I_blognav"). getElementsByTagName ("Li");
for (var i=0; i<liitem.length; i++) {
Liitem[0].onmouseover=function () {Ileftnav ("Writeblog")}
Liitem[1].onmouseover=function () {Ileftnav ("Sharepic")}
Liitem[2].onmouseover=function () {Ileftnav ("writemsg")}
}
}

This article is a simple mouse mo over effect, with CSS can also be achieved, but relatively cumbersome. If you need a cooler, more flashy effect, click here to view the jquery-based bubble tip that Cssrain writes.
The original published in Mr.think's personal blog: http://mrthink.net/script-mousechange-simple/