Изменение положения в DIV на свитке

Question

У меня есть таблица

<table> 
<tr> <td> ---- asp.net gridview </td> 
<td> <div class=persondetails> </div> </td></tr> 
</table> 

Моего Javascript получил от другого форума статьи

<script language="javascript" type="text/javascript"> 
     var personDetail = document.querySelector('.persondetails'); 
     alert (personDetail); 
     var origOffsetY = personDetail.offsetTop; 
     debugger; 
     function onScroll(e) { 
      debugger; 
      window.scrollY >= origOffsetY ? personDetail.classList.add('sticky') : 
              personDetail.classList.remove('sticky'); 
     } 

     document.addEventListener('scroll', onScroll); 
    </script> 

Моего asp.net GridView растет вертикально в зависимости от нет. лиц. Когда выбран человек в сетке, div на втором td заполняется некоторыми полями. Он работает нормально.

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

Есть ли способ показать div на правой стороне td для прокрутки вниз, когда пользователи прокручивают страницу вниз? Я проверил другие ссылки на этом форуме, но не получилось. Я не уверен, что это связано с моей таблицей и тд-макетом.

Я получаю null при указанном предупреждении.

Answer 1

Вы должны использовать position fixed так:

var $details = $(".details"), 
    detailsPos = $details.position().top; 
$(window).on("scroll", function() { 
    if ($(window).scrollTop() > detailsPos) 
     $details.css("position", "fixed").css("top",0); 
    else 
     $details.css("position", "static"); 
}); 

Working example.

Обратите внимание, что код должен быть обернут в document ready так:

$(function() { 
    // ... code ... 
}); 

Также проверьте position fixed compatibility here

Answer 2

лучшим подходом было бы использование стилей в стиле CSS.

• Вы можете установить свой правый div для отображения всегда при прокрутке, например. липкие divs или
• Вы можете обернуть вид сетки в div с фиксированной высотой, чтобы ваша левая таблица прокручивалась в этом div внутри порта представления.