var Hover = Class.create();
Object.extend(
	Object.extend(Hover.prototype, Abstract.prototype),{
		initialize: function(target, options) {
			this.container = $('container');
			this.target = this.container.getElementsBySelector(options.target);
			this.images	= this.container.getElementsBySelector(target);
			this.events = {
				hover: this.hover.bind(this)
			}
			
			this.addObservers();

		},
		addObservers: function() {
			if(this.images){
				for( var i=0; i < this.images.length;i++){
					var li = this.images[i].up('li')
					if(li){
						Event.observe(li, 'mouseover', this.events.hover);
						li.style.cursor = "pointer";
					}
				}
			}
		},
		hover: function(event) {
			// alert(Event.element(event));
			var img = Event.element(event).down('img');
			if(this.target){
				this.target.each(function(s,i){
					s.down('img').src = img.src
				});
			}
		}
	}
);
addLoadEvent(function(){
	if(typeof Hover == "function"){
		resultaat = new Hover('div#content ul li img',{
				target: 'div#right'
			});
	}
});
