window.addEvent('domready', function() {
	
	var photos = $$('#photos li');
	var bubbles = $$('#bubbles li');
	
	var starter = $$('#bubbles li.show');
	
	bubbles.setStyle('opacity', 0);
	
	starter.morph({
			'opacity' : 1,
			'margin-top' : '-10px'
	});	
	
	photos.each(function(el, i) {
								 
		el.set('morph', {link : 'cancel'});
		
		el.addEvents({
			'mouseenter': function() {
				bubbles[i].morph({
					'opacity' : 1,
					'margin-top' : '-10px'
				});
				if(bubbles[i] != starter[i]) {
					starter.morph({
						'opacity' : 0,
						'margin-top' : 0
					});
				}
			},
			'mouseleave' : function() {
				bubbles[i].morph({
					'opacity' : 0,
					'margin-top' : 0
				});
				starter.morph({
					'opacity' : 1,
					'margin-top' : '-10px'
				});
			}	
		});
	});
	
});
