var rolloverItemImg = new Class({
	initialize: function(elemId, itemSku) {
		this.domNode = $(elemId);
		this.imgUrl = 'http://images.shipwreckbeads.com/Images/' + itemSku + '.JPG';
		var instance = this;
		this.domNode.addEvent('mouseenter', function() { instance.showImage(true) });
		this.domNode.addEvent('mouseleave', function() { instance.showImage(false) });
		this.domNode.setStyle('position', 'relative');
		this.domImgDiv = null;
		this.divEffect = null;
	},

	showImage: function(bShow) {
		if(bShow) {
			if(this.domImgDiv == null) {
				var newDiv = new Element('div');
				var newImg = new Element('img');
				newDiv.appendChild(newImg);
				newImg.src = this.imgUrl;
				newDiv.setStyles({
					position: 'absolute',
					right:'100%',
					top:0,
					border: '1px solid black',
					padding: '2px',
					background: 'white',
					opacity: 0.0					
				});
				this.domNode.appendChild(newDiv);	
				this.domImgDiv = newDiv
			}
			if(this.divEffect == null) {
				this.divEffect = this.domImgDiv.effects()
			} else {
				this.divEffect.stop();
			}
			this.divEffect.start({'opacity':[this.domImgDiv.getStyle('opacity'),1]});
			/*	
			this.domImgDiv.setStyles({
				visibility:'visible',
				opacity:1
			});*/
		} else {
			if(this.divEffect == null) {
				this.divEffect = this.domImgDiv.effects();
			} else {
				this.divEffect.stop();
			}
			this.divEffect.start({'opacity':[1,0]});
		}
		
	}
});

function addRolloversToList(listId, lstSkus) {
	listDom = $(listId);
	children = listDom.getChildren();
	for(var i=0;i < children.length; i++) {
		var childRollover = new rolloverItemImg(children[i], lstSkus[i]);
	}
}