function toggleImage(e) {
	li = Event.element(e).up('li')
	position_x = Event.pointerX(e) - li.offsetLeft
	if (position_x > li.getWidth() -1 ) position_x = li.getWidth() - 1
	var background_image = li.getStyle('backgroundImage').split('url(');
	background_image = background_image[1].split(')');
	background_image = background_image[0];
	image = new Image();
	image.src = background_image;
	elements_count = image.height / 160
	line_width = 160 / elements_count
	offset = (position_x / line_width).floor()
	li.setStyle({
		backgroundPosition: '0 -' + offset * 160 + 'px'
	})
	li.down('div').setStyle({
		width: line_width + 'px',
		left: offset * line_width + 'px',
		backgroundColor: 'black',
		opacity: '0.6'
	})
}

function launchEvents() {
	$$('ul.images_list li').each(function(li) {
		Event.observe(li, 'mousemove', toggleImage)
	})
} // launchEvents

Event.observe(window, 'load', launchEvents)
