window.addEvent('domready', function() {
	$$(".hoverable img, img.hoverable").each( function(img) {
		var classes = img.getProperty('class');
		var srcid = img.getProperty('id');
		var src = img.getProperty('src');
		var extension = src.substring(src.lastIndexOf('.'),src.length);
		var back = new Element("span").setStyles({
			'top': 0,
			'left': 0,
			'background-position': 'left center',
			'background-repeat': 'no-repeat',
			'background-image': 'url(\''+src.replace(extension,'_hover' + extension)+'\')',
			'display': 'block',
			'width': img.getStyle('width'),
			'height': img.getStyle('height')
		}).wraps(img);
		back.setProperty('id', srcid + '_hover' );
		back.setProperty('class', 'hoverable_bg');
		img.addEvents({
			mouseenter: function() {
				img.morph({
					opacity: 0,
					duration: 150
				});

			},
			mouseleave: function() {
				img.morph({
					opacity: 1,
					duration: 150
				});

			}
		});

	});
	$$(".nofade").each( function(img) {
		var src = img.getProperty('src');
		var extension = src.substring(src.lastIndexOf('.'),src.length);

		img.addEvents({

			mouseenter: function() {
				img.setProperty('src',src.replace(extension,'_hover' + extension));
			},
			mouseleave: function() {
				img.setProperty('src',src);
			}
		});

	});
});