Team:University College London/js/frontslide

From 2012.igem.org

Revision as of 14:40, 4 August 2012

$(document).ready(function(){

    var currentSlide = 1;
    var inTransition = false;
    function transition(newSlide){
           if(inTransition == false){
                 inTransition = true;
                 $('#slide'+currentSlide).animate({left:'-990px'},1000,"easeInOutCubic");
                 $('#slide'+newSlide).animate({left:'0px'},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');});});
                  }
             }

     // 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);});

     $('#label3').hover(function(){pinHop(3);});
     $('#pin3').hover(function(){pinHop(3);});

     $('#label4').hover(function(){pinHop(4);});
     $('#pin4').hover(function(){pinHop(4);});

     $('#label5').hover(function(){pinHop(5);});
     $('#pin5').hover(function(){pinHop(5);});

     // Slide 2 setup
     $('#zoom1').mouseIn(function(){$('#popup1').show();}).mouseOut(function(){$('#popup1').hide();});

      });