$(document).ready(function(){
    
    function toggleImage(subject,path){
        this.path = path;
        this.sbj = subject;
    }
    //add methods
    toggleImage.prototype.imgPreload = function(img){
	var imgObj = new Image();
	imgObj.src = img;
    }
    toggleImage.prototype.set = function(id,image) {
        var sbj = this.sbj;
	var url = this.path + image;
	var setting ={background:'url(' + url + ') transparent'};
	this.imgPreload(url);
	$(id).mouseover(function(){
            $(sbj).css(setting);
	});
	$(id).mouseout(function(){
	});
    }
    toggleImage.prototype.revert = function(id,image) {
        var sbj = this.sbj;
	var url = this.path + image;
	var setting ={background:'url(' + url + ') transparent'};
	this.imgPreload(url);
	$(id).mouseout(function(){
           $(sbj).css(setting);
	});
    }
        
    var gNavi = new toggleImage("#gNavi","./img/");
    gNavi.set('#gNavi_1','gNavi_bg_1.png');
    gNavi.set('#gNavi_2','gNavi_bg_2.png');    
    gNavi.set('#gNavi_3','gNavi_bg_3.png');
    gNavi.set('#gNavi_4','gNavi_bg_4.png');
    gNavi.set('#gNavi_5','gNavi_bg_5.png');
    gNavi.set('#gNavi_6','gNavi_bg_6.png');
    gNavi.revert('ul#gNavi','gNavi_bg.png');
});