一个简单的js鼠标划过切换效果

  //@Mr.Think获取对象属性兼容方法

  function $(objectId) {

  if(document.getElementById && document.getElementById(objectId)) {

  return document.getElementById(objectId);// W3C 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 won't find nested layers

  } else {

  return false;

  }

  }

  //@Mr.Think切换显示文字和背景图位置

  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.Think加载鼠标莫过事件

  window.onload=function(){

  var liitem=$("i_blognav").getElementsByTagName("li");

  for(var i=0; i

  liitem[0].onmouseover=function(){iLeftNav("writeblog")}

  liitem[1].onmouseover=function(){iLeftNav("sharepic")}

  liitem[2].onmouseover=function(){iLeftNav("writemsg")}

  }

  }