無法獲得動畫的其餘部分

Question

問題：僅獲取動畫的第一部分。它不會運行懸停動畫。 這個想法是讓底部在盤旋時向上或向下移動。

在這個網站的工作： http://ripsraps.com/daniel/

使用這個腳本動畫的導航欄： http://net.tutsplus.com/tutorials/javascript-ajax/how-to-create-a-mootools-homepage-inspired-navigation-effect-using-jquery/

這是Jquery的：

$(document).ready(function() 
{ 
    slide("#sliding-navigation", 25, 15, 150, .8); 
}); 

function slide(navigation_id, pad_out, pad_in, time, multiplier) 
{ 
    var list_elements = navigation_id + " li.sliding-element"; 
    var link_elements = list_elements + " a"; 
    var timer = 0; 
    $(list_elements).each(function(i) 
    { 

     $(this).css("margin-top","-180px"); 
     timer = (timer*multiplier + time); 
     $(this).animate({ marginTop: "0" }, timer); 
     $(this).animate({ marginTop: "15px" }, timer); 
     $(this).animate({ marginTop: "0" }, timer); 
    });  
    $(link_elements).each(function(i) 
    { 
     $(this).hover(
     function() 
     { 
      $(this).animate({ paddingTop: pad_out }, 150); 
     },  
     function() 
     { 
      $(this).animate({ paddingTop: pad_in }, 150); 
     }); 
    }); 
} 

PS：我不知道小提琴，並不會給任何小提琴鏈接。

Answer 1

現在您的動畫就像在Chrome調試器中檢查代碼時所看到的一樣。它只是不顯示，因爲你沒有正確應用它。

我想你應該將懸停效果應用於list_elements而不是link_elements。我也會使用marginTop動畫，而不是paddingTop。

PS：小提琴並不那麼難，你真的應該嘗試一次。