Scrollen zu verdecktem Element

Question

Ich habe ein verstecktes Eingabefeld, innerhalb einer Tabelle td, und wenn ich Option A wähle, möchte ich, dass der Browser zu dem sichtbaren Eingang scrollt, der sich in einem table td befindet. Ich habe Code versucht, aber etwas funktioniert nicht richtig. ID des Eingabefeldes: #id_a-1-host

jQuery('html,body').animate({scrollTop: jQuery('#id_a-1-host').offset().top},'slow'); 

Es scrollt nach unten, aber nur ein wenig. Es scrollt nicht nach unten zum Eingabefeld.

Answer 1

Die scrollTop basiert auf der Sichtbarkeit und wenn Sie es ausgeblendet haben, mit display: none, ist es nicht im Ansichtsfenster verfügbar, so dass es nicht wie erwartet funktioniert. Es ist immer besser, einen benannten Anker in diesen Fällen zu verwenden:

<a name="id-a-off" id="id-a-off"> 

Oder sogar eine leere Spanne tun:

<span name="id-a-off" id="id-a-off"></span> 

Stellen Sie sicher, dies in einem statischen Elternteil ist.

Auch, wenn Sie einen statischer Header oder etwas eingerichtet haben, müssen Sie diese Höhe hinzufügen auch:

jQuery('html,body').animate({ 
    scrollTop: jQuery('#id_a-1-host').offset().top - staticHeaderHeight 
}, 'slow');