jQuery: Giữ nguyên vị trí thanh cuộn với sessionStorage
Giả sử ta có thẻ <nav class="scroll">, và trong nó chứa nhiều link, khi bạn nhấn vào 1 link nào đó để xem bài viết tương ứng thì trang web được tải lại, khi đó thanh cuộn sẽ về trạng thái ban đầu là nằm ở trên cùng (top), và điều này sẽ gây bất tiện khi muốn xem bài viết tiếp ở link tiếp theo. Để giữ nguyên vị trí thanh cuộn sau khi tải trang web thì ta sử dụng sessionStorage như sau:
// Lưu trữ vị trí thanh cuộn bằng sessionStorage
if('sessionStorage' in window && window['sessionStorage']!==null){
$('.scroll').on('scroll',function(){
sessionStorage.setItem('scrollLeft',$(this).scrollTop());
});
$('.scroll').animate({scrollTop:sessionStorage.getItem('scrollLeft')},0);
}