JavaScriptによるシンプルロールオーバー

メモを取っておいたと思いきや残っていなかったので再度。
　
スマートロールオーバー
http://css-happylife.com/log/javascript/000157.shtml

function smartRollover() {
	if(document.getElementsByTagName) {
		var images = document.getElementsByTagName("img");

		for(var i=0; i < images.length; i++) {
			if(images[i].getAttribute("src").match("_off."))
			{
				images[i].onmouseover = function() {
					this.setAttribute("src", this.getAttribute("src").replace("_off.", "_on."));
				}
				images[i].onmouseout = function() {
					this.setAttribute("src", this.getAttribute("src").replace("_on.", "_off."));
				}
			}
		}
	}
}

if(window.addEventListener) {
	window.addEventListener("load", smartRollover, false);
}
else if(window.attachEvent) {
	window.attachEvent("onload", smartRollover);
}

　
シンプルロールオーバー
http://le-arche.jugem.jp/?eid=57

function smartOver() {
smartRollover('tes');
}
function smartRollover(idName) {
if(document.getElementsByTagName) {
var images = document.getElementById(idName).getElementsByTagName("img");

for(var i=0; i < images.length; i++) {
if(images[i].getAttribute("src").match(/_off\./))
{
images[i].onmouseover = function() {
this.setAttribute("src", this.getAttribute("src").replace("_off.", "_on."));
}
images[i].onmouseout = function() {
this.setAttribute("src", this.getAttribute("src").replace("_on.", "_off."));
}
}
}
}
}
if(window.addEventListener) {
window.addEventListener("load", smartOver, false);
}
else if(window.attachEvent) {
window.attachEvent("onload", smartOver);
}
else{
window.onload = smartOver;
}

　
後者の場合、オン・オフを使い分ける範囲を指定できるので、ロールオーバーはしないけど「_on.gif」なんてのがある場合は便利です。
ただし、範囲があっちこっちに複数にまたがるのであれば、素直に前者を使用するほうがいいかと。