ロールオーバー時の画像切り替えについて
複数の画像ボタンを配置し、
ロールオーバーするとある位置に配置している画像を切り替えるようにしているのですが、
現状だとロールアウト後に初めの画像、初期値に戻ってしまうので
一番最後にロールオーバーした画像でストップさせたいと思っています。
現状、下記スクリプトを設置しているのですが
お分かりの方が追われましたらご教授頂けないでしょうか。
どうぞ宜しくお願いします！
MultiRollover = function(_listener)
{
this.listener_id = _listener;
this.target_id = "";
this.sources = [];
}
MultiRollover.prototype = {
addTarget: function(_target)
{
this.target_id = _target;
},
addSource: function()
{
for(var i=0; i<arguments.length; i++)
{
this.sources.push(arguments[i]);
}
},
create: function()
{
var listener = document.getElementById(this.listener_id);
if(document.getElementById(this.target_id))
{
var out_target = document.getElementById(this.target_id);
var over_targets = out_target.getElementsByTagName("a");
}
for(var i=0; i<over_targets.length; i++)
{
var over_target = over_targets[i];
var src = this.sources[i];
var callback = (function(_src)
{
return function()
{
this.src = _src;
};
})(src);
this.observe(over_target, "mouseover", listener, callback);
(new Image).src = src;
src = this.sources[0];
callback = function()
{
this.src = src;
};
this.observe(over_target, "mouseout", listener, callback);
}
},
observe: function(_el, _func, _listener, _callback)
{
if(_el.addEventListener)
{
_el.addEventListener(_func, function(e)
{
_callback.call(_listener, e);
}, false);
}
else if(_el.attachEvent)
{
_el.attachEvent("on"+_func, function(e)
{
_callback.call(_listener, e);
});
}
}
}
お礼
わかりやすいご説明ありがとうございました