Team:University College London/js/frontslide
From 2012.igem.org
Revision as of 23:59, 26 August 2012 by PhilippBoeing (Talk | contribs)
$(document).ready(function(){
var currentSlide = 1; var inTransition = false; function transition(newSlide){ if((newSlide != currentSlide) && (inTransition == false)){ inTransition = true; $('#bottle'+(newSlide-1)).unbind('mouseenter').unbind('mouseout').animate({opacity:1},1); $('#bottle'+(currentSlide-1)).animate({opacity:0.4},1).mouseenter(function(){$(this).animate({opacity:0.9},50);}).mouseout(function(){$(this).animate({opacity:0.4},50);}); if(newSlide > currentSlide){ $('#slide'+newSlide).animate({left:'990px'},1).animate({left:'0px'},1000,"easeInOutCubic"); $('#slide'+currentSlide).animate({left:'0px'},5).animate({left:'-990px'},1000,"easeInOutCubic",function(){ currentSlide = newSlide; inTransition = false; });
} else { $('#slide'+newSlide).animate({left:'-990px'},1).animate({left:'0px'},1000,"easeInOutCubic"); $('#slide'+currentSlide).animate({left:'0px'},5).animate({left:'+990px'},1000,"easeInOutCubic",function(){ currentSlide = newSlide; inTransition = false; }); } } }
function pinHop(pin){ if($('#pin'+pin).hasClass('animating') == false){ $('#pin'+pin).addClass('animating').animate({top:'-=15px'},200,function(){$('#pin'+pin).animate({top:'+=15px'},200,function(){$('#pin'+pin).removeClass('animating');});}); } if($('#pin'+pin+'shadow').hasClass('animating') == false){ $('#pin'+pin+'shadow').addClass('animating').animate({left:'+=12px',top:'-=12px'},200,function(){$('#pin'+pin+'shadow').animate({left:'-=12px',top:'+=12px'},200,function(){$('#pin'+pin+'shadow').removeClass('animating');});}); } }
// bottle setup $('#bottle0').click(function(){transition(1);}); $('#bottle1').mouseenter(function(){$(this).animate({opacity:0.9},50);}).mouseout(function(){$(this).animate({opacity:0.4},50);}).click(function(){transition(2);}); $('#bottle2').mouseenter(function(){$(this).animate({opacity:0.9},50);}).mouseout(function(){$(this).animate({opacity:0.4},50);}).click(function(){transition(3);});
// Slide 1 setup $('#label1').hover(function(){pinHop(1);}); $('#pin1').hover(function(){pinHop(1);}); $('#label1').click(function(){transition(2);}); $('#pin1').click(function(){transition(2);});
$('#label2').hover(function(){pinHop(2);}); $('#pin2').hover(function(){pinHop(2);}); $('#label2').click(function(){transition(3);}); $('#pin2').click(function(){transition(3);});
$('#label3').hover(function(){pinHop(3);}); $('#pin3').hover(function(){pinHop(3);}); $('#label3').click(function(){$('#mapopen').fadeIn(300);}); $('#mapopen').mouseout(function(){$('#mapopen').fadeOut(300);});
$('#label4').hover(function(){pinHop(4);}); $('#pin4').hover(function(){pinHop(4);});
$('#label5').hover(function(){pinHop(5);}); $('#pin5').hover(function(){pinHop(5);});
// Slide 2 setup $('#zoom1').mouseenter(function(){$('#popup1').show();}).mouseout(function(){$('#popup1').fadeOut(150);}); $('#zoom2').mouseenter(function(){$('#popup2').show();}).mouseout(function(){$('#popup2').fadeOut(150);}); $('#zoom3').mouseenter(function(){$('#popup3').show();}).mouseout(function(){$('#popup3').fadeOut(150);});
//Slide 3 setup $('#s3back').mouseenter(function(){$('#s3back').animate({opacity:1},100);}).mouseout(function(){$('#s3back').animate({opacity:0.7},100);}); $('#s3back').click(function(){$('#s3back').animate({opacity:0.7},100); transition(1);}); $('#course1').mouseenter(function(){$('#line1').show();}).mouseout(function(){$('#line1').hide();}); $('#course2').mouseenter(function(){$('#line2').show();}).mouseout(function(){$('#line2').hide();}); $('#course3').mouseenter(function(){$('#line3').show();}).mouseout(function(){$('#line3').hide();}); $('#course4').mouseenter(function(){$('#line4').show();}).mouseout(function(){$('#line4').hide();}); $('#course5').mouseenter(function(){$('#line5').show();}).mouseout(function(){$('#line5').hide();}); $('#course6').mouseenter(function(){$('#line6').show();}).mouseout(function(){$('#line6').hide();}); $('#course7').mouseenter(function(){$('#line7').show();}).mouseout(function(){$('#line7').hide();}); $('#course11').mouseenter(function(){$('#line1').show();}).mouseout(function(){$('#line1').hide();}); $('#course22').mouseenter(function(){$('#line2').show();}).mouseout(function(){$('#line2').hide();}); $('#course33').mouseenter(function(){$('#line3').show();}).mouseout(function(){$('#line3').hide();}); $('#course44').mouseenter(function(){$('#line4').show();}).mouseout(function(){$('#line4').hide();}); $('#course55').mouseenter(function(){$('#line5').show();}).mouseout(function(){$('#line5').hide();}); $('#course66').mouseenter(function(){$('#line6').show();}).mouseout(function(){$('#line6').hide();}); $('#course77').mouseenter(function(){$('#line7').show();}).mouseout(function(){$('#line7').hide();});
});