предотвращать дефолт по именованным якорям

Question

Я использую функцию для плавной прокрутки к подразделам моей страницы.

Код requires-

event.preventDefault(); 

-в предотвратить страницу от прыжков к вершине, когда якорь щелкнул, но он также не добавляет хэштегом к URL, который используется для поисковой оптимизации.

Это функция прокрутки, которую я использую.

<script type="text/javascript"> 
$('.secondaryNav a').click(function(event){ 
     event.preventDefault(); 
     //calculate destination place 
     var dest=0; 
     scrolling = false; 
     if($(this.hash).offset().top > $(document).height()-$(window).height()){ 
       dest=$(document).height()-$(window).height(); 

     }else{ 
       dest=$(this.hash).offset().top; 
     } 
     //go to destination 
     $('html,body').animate({scrollTop:dest}, 2000,'easeInOutCubic',function() { 
     }); 

    }); 
</script> 

Answer 1

preventDefault остановит хэш от добавления к URL-адресу, но вы можете добавить его самостоятельно.

location.hash = this.hash; 

Это будет вызывать onhashchange и прокручивать браузер на хэш, поэтому убедитесь, что вы называете это после того, как свиток делается.

var hash = this.hash; 
$('html,body').animate({scrollTop:dest}, 2000,'easeInOutCubic',function() { 
    location.hash = hash; 
}); 

DEMO: http://jsfiddle.net/Sub7m/4/show/ (редактировать его по адресу: http://jsfiddle.net/Sub7m/4/)

Если ваш браузер поддерживает его, вы можете также использовать history.replaceState({}, null, this.hash) добавить хэш URL без перемещения браузера или вызова onhashchange.

DEMO: http://jsfiddle.net/Sub7m/5/show/ (редактировать его по адресу: http://jsfiddle.net/Sub7m/5/)