Comment faire en sorte que l’élément sélectionné dans la zone de liste défile vers le haut?

Je crée une simple liste d’éléments de tableau. Des barres de défilement apparaîtront si la liste est longue. Cependant, ma question est la suivante: lorsqu’un élément est sélectionné, j’aimerais le voir en haut de la position visible, en poussant tous les éléments ci-dessus masqués sous la barre de défilement. Ainsi, peu importe l’élément que je sélectionne, il devrait figurer en haut de la liste déroulante visible. Ce n’est pas la même chose que de placer l’élément en haut, mais simplement en haut de l’écran. J’espère que ma question est comprise ici.

Merci pour toute aide ou direction que je peux obtenir.

Vous pouvez utiliser ce code:

$('#scrollable li').on('click', function(e){ $('#scrollable').animate({scrollTop: $(e.target).position().top + $('#scrollable').scrollTop()}); }); 

Voir aussi ce JSFiddle: http://jsfiddle.net/729nX/1/

après beaucoup de recherches sur Google, j’ai trouvé que vous pouvez utiliser scrollTo () en utilisant JavaScript avec un code similaire à celui-ci.

 function scrollToElem(elem) { if(pageElement != null){ window.scrollTo(elem.offsetTop, 0); } } var elem= document.getElementById('your_element'); scrollToElem(elem); 

ou utilisez use location.hash qui me semble la solution la plus simple avec quelque chose seul les lignes de

 location.hash = '#' + 'your_element'; 

si vous avez une barre de défilement dans un élément au lieu de la totalité de la fenêtre.

Element.scrollTop – MDN

Element.scrollTop – école W3

 function onSelect(list, selectedItem){ list.scrollTop = selectedItem.offsetTop - list.offsetTop; }