我正在嘗試將這個很酷的滑動下劃線動畫集成到我的 Wordpress 導航標題中（Storefront 子主題，如果這很重要），但它沒有正常運行（根本沒有）。您可以在此處查看原始代碼筆。下面是我為我的網(wǎng)站調(diào)整代碼的嘗試。作者的 codepen 示例顯示了鼠標單擊時的動畫，但我希望它顯示出來hover。而且我只想要下劃線動畫，不關心鏈接的顏色變化，所以我嘗試刪除不必要的部分。我已將我的 JS 文件放入 Wordpress 的functions.php 中。我很確定它加載了，我通過向alert確實彈出的 .js添加一個來測試它當我的代碼運行時，什么也沒有發(fā)生。我在調(diào)試這個時遇到了麻煩，因為我有點被困在 Wordpress 沙箱中，并且對 WP 和 JS 都非常缺乏經(jīng)驗。我很有可能在 .js 的某個地方犯了一個非?；镜腻e誤，我可能沒有正確定位鏈接。也將感謝任何巧妙的方法來循環(huán)鏈接指向它們各自的moveToIndex號碼的建議！jQuery(function() {  var currentIndex = 1;  // Always moving to same item, just to test  $(".menu a").hover(function() {    moveToIndex(2);  });  function moveToIndex(idx) {    if (idx === currentIndex)      return;    var fromTab = $(".menu li:nth-child(" + currentIndex + ")"),      toTab = $(".menu li:nth-child(" + idx + ")"),      underlineborder = $(".underlineborder"),      animationDuration = 150;    var fromLeft = 0,      fromRight = 0,      toLeft = toTab.offset().left - toTab.parent().offset().left,      toRight = toTab.offset().left + $(toTab).width();    if (fromTab.length > 0) {      fromLeft = fromTab.offset().left - fromTab.parent().offset().left;      fromRight = fromLeft + fromTab.width();    }    $(".menu a").removeClass("active");    toTab.addClass("active");    underlineborder.animate({      left: currentIndex < idx ? fromLeft : toLeft,      width: currentIndex < idx ? toRight - fromLeft : fromRight - toLeft    }, animationDuration).animate({      left: toLeft,      width: toTab.width()    }, animationDuration);    currentIndex = idx;  }  // initialize tabs  moveToIndex(1);});.menu li {  cursor: pointer;  display: inline-block;  margin: 5px 7px 10px 7px;  opacity: .65;  transition: .3s transform;}.menu li.active {  cursor: default;  opacity: 1;  text-shadow: 0 0 4px rgba(0, 0, 0, .8);  transform: translateY(-3px);}.underlineborder {  background: red;  border-radius: 5px;  cursor: default;  position: absolute;  height: 3px;  width: 10px;  margin: 0;  opacity: 1;  bottom: 0;  left: 0;}