2012-07-07 61 views
1

我试图让我的代码在动画运行后跟随链接。jQuery - .animate之后的链接

这个想法是,“Gnoll”击中了你的按钮,并且会将你发送到链接。

这是到目前为止我的代码:

它不是里面的链接。

(另外,按钮的颜色应该是通过“打”的动画。到目前为止,我已经失败的一个中途改变对)

$(document).ready(function(){ 


    $('.Homebutton').click(function(){ 

     $('.animateme').html('<img src="Construct2/Images/Gnoll_Running.gif" />');   
     $('.animateme').animate({ 
      left: '+=150', 
     }, 800, function() { 
      $('.animateme').html('<img src="Construct2/Images/Gnoll_Hit.gif" />'); 
     }); 
     $('.animateme').animate({ 
      left: '+=0', 
     }, 500); 

     $('.animateme').animate({ 
      left: '+=0', 
     }, 500, function() { 
      $('.animateme') .html('<img src="Construct2/Images/Gnoll_Resting_smaller.gif" />'); 
      }); 

    }); 

    $('#AddOnbutton').click(function(){ 
     $('.animateme').html('<img src="Construct2/Images/Gnoll_Running.gif" />');   
     $('.animateme').animate({ 
      left: '+=250', 
     }, 1000, function() { 
      $('.animateme').html('<img src="Construct2/Images/Gnoll_Hit.gif" />') 

     }); 
     $('.animateme').animate({ 
      left: '+=0', 
     }, 1000, function() { 
      $('.animateme') .html('<img src="Construct2/Images/Gnoll_Resting_smaller.gif" />'); 
      $("#AddOnbutton").html('<img src="Construct2/Images/redbutton.png" />'); 
      }); 


    }); 

}); 

的代码是非常基础,你可以看到。 链接应该最后

$('.animateme') .html('<img src="Construct2/Images/Gnoll_Resting_smaller.gif" />'); 

回答

0

后触发0.5秒我现在已经有点找到了自己:) 还不够完善,但它的确定。

$('a.home').click(function(){ 
    var newLocation = $(this).attr('href'); 
     $('.animateme').html('<img src="Construct2/Images/Gnoll_Running.gif" />');   
     $('.animateme').animate({ 
      left: '+=150', 
     }, 800, function() { 
      $('.animateme').html('<img src="Construct2/Images/Gnoll_Hit.gif" />'); 
     }); 
     $('.animateme').animate({ 
      left: '+=0', 
     }, 500); 

     $('.animateme').animate({ 
      left: '+=0', 
     }, 500, function() { 
      $('.animateme') .html('<img src="Construct2/Images/Gnoll_Resting_smaller.gif" />'); 

      document.location = newLocation; 
      }); 
      return false;  
    });