给一个锚定标记多个功能 - HTML

Question

在我的网页中，我有多个锚定标记，并且我已经指定它们在单击时滚动到页面的顶部。我将如何让它们向上滚动，然后按照该顺序重定向到href中的页面？

的jsfiddle - http://jsfiddle.net/TkdMJ/

HTML

<a href="javascript:void(0)" onClick="goToByScroll('translation_list')" href="VideoPages/Azeri/Heydər Oğuzun1-ci hissə.html"> 
     <li> 
     <img src="../Images/Article Images/GuliyevFace14.png" class="li-image" /> 
     <h3 class="li-header">Heydər Oğuzun Rəsul Quliyevlə Müsahibəsi - 29 İyul 2012, 1-ci hissə</h3> 

     <p class="li-text">Yayımlanıb on Aug 1, 2012 - Rəsul Quliyev</p> 
     <p class="li-text">Heydər Oğuzun Rəsul Quliyevlə müsahibəsi - 29 İyul 2012, 1-ci hissə Heydar Oguz's Interview with Rasul Guliyev on July 29, 2012, Part 1 
</p> 
     </li> 
     </a> 

的Javascript

function goToByScroll(id){ 
     $('html,body').animate({scrollTop: $("#"+id).offset().top},'slow'); 
} 

Answer 1

你有这将导致一个问题的链接上的两个href属性。我会将jQuery click事件附加到锚点元素，并在动画完成后重定向。您还需要拨打preventDefault，以便默认情况下链接不会重定向。

$("#link").click(function(e) { 
    $("body").animate({ 
     scrollTop: $("body").offset().top 
    }, "slow", function() { 
     alert("redirecting to " + $(e.target).attr("href")); 
     window.location.href = $(e.target).attr("href"); 
    }); 

    e.preventDefault(); 
}); 

我更新了此jsFiddle中的解决方案。