2012-12-05 4 views
2

Я использую jquery функцию scrollTop, чтобы получить прокрутку гладкой при переключении между различными якорями. первые, здесь гиперссылкаjQuery scrollTop - анимация stucks в конце перемещения

the problem

это мой JQuery скрипт

«Зил» является только немецким словом для «целей», просто чтобы вы знаете, почему это переменный называются «Зил "

$(document).ready(function() { 
    $('a[href*=#]').bind("click", function(event) { 
     event.preventDefault(); 
     var ziel = $(this).attr("href"); 

     $('#portraitcontent').animate({ 
      scrollTop: $(ziel).offset().top 
     }, 3000 , function(){location.hash = ziel;}); 
}); 
return false; 
}); 

так как я получить плавный скроллинг без этой уродливой прыжки в конце анимации? любые идеи?

Я действительно не знаю, что делать. тратить часы с этой сукой!

благодарит за ваши советы!

EDIT

Ну с этим новым кодом:

$(document).ready(function() { 
    $('a[href*=#]').bind("click", function(event) { 
     event.preventDefault(); 
     var ziel = $(this).attr("href"); 
     $('#portrait-entry').animate({ 
      scrollTop: $(ziel).offset().top - 230 
     }, 1500 , function(){ 

      if(window.history.replaceState){ 
       window.history.replaceState(null, document.title, ziel); // <--here 
      } 
     }); 
}); 
return false; 
}); 

плавная прокрутка работает без уродливого прыжков НО сейчас мои anchorlinks не работают так, как они должны.

, пожалуйста, проверьте the problem - когда вы нажимаете «fortbildungen», а затем на «mitgliedschaften», он не прокручивается до якоря. Я думаю, что мне нужно выполнить сброс или s.th. например, потому что я думаю, что когда вы находитесь на странице #anchor, ссылки не работают так, как должны.

Я не в js/jquery. так что, может быть, кто-то может дать мне совет. Я не знаю, как решить эту проблему.

Благодарим вас за помощь и за отредактированный код, который сделал мою прокрутку гладкой.

+1

В вашей обратном вызове функции анимации, вы сообщаете окно, чтобы выполнить этот прыжок, установив 'location.hash = ziel'. – Ohgodwhy

ответ

0

Наконец я решил удалить этот scrollTop код и перейти к jQuery.scrollTo плагин в сочетании с jQuery.localScroll.

Просто, чтобы вы знаете

0

Просто потому, что вы изменили URL-адрес в анимированном обратном вызове, уродливые прыжки.

Решение для браузера, поддерживающего html5, заключается в использовании «window.history.replaceState» для изменения URL-адреса вместо прямого URL-адреса.

Код хотел бы ниже:

$(document).ready(function() { 
    $('a[href*=#]').bind("click", function(event) { 
     event.preventDefault(); 
     var ziel = $(this).attr("href"); 

     $('#portraitcontent').animate({ 
      scrollTop: $(ziel).offset().top 
     }, 2500 , function(){ 

      if(window.history.replaceState){ 
       window.history.replaceState(null, document.title, ziel); // <--here 
      } 
     }); 
}); 
return false; 
});