Как прокрутить к началу div с помощью jQuery? - PullRequest
46 голосов
/ 03 марта 2010

У меня есть сетка внутри div. Я хочу прокрутить верхнюю часть div от нижней части div, используя jquery. Любое предложение ..

<div id="GridDiv">
// gridview inside..
</div>

У моего gridview будут пользовательские кнопки ссылок, сгенерированные для разбивки на страницы ... Я буду прокручиваться к верхней части элемента div из нижней части щелчка по кнопке ссылки ...

protected void Nav_OnClick(object sender, CommandEventArgs e)
    {
        LinkButton lb1 = (LinkButton)sender;
        //string s = lb1.ID;
        ScriptManager.RegisterClientScriptBlock(lb1, typeof(LinkButton), 
 "scroll", "javascript:document.getElementById('GridDiv').scrollTop = 0;", true);

Вместо javascript я буду вызывать функцию jquery ... Любое предложение ...

EDIT:

Точно так же, как вопросы Stackoverflow для каждой пользовательской страницы ... При смене номеров страниц он прокручивается вверх с плавным эффектом ... Я хочу добиться этого ...

Ответы [ 6 ]

169 голосов
/ 11 января 2012

Вот что вы можете сделать с помощью jquery:

$('#A_ID').click(function (e) { //#A_ID is an example. Use the id of your Anchor
    $('html, body').animate({
        scrollTop: $('#DIV_ID').offset().top - 20 //#DIV_ID is an example. Use the id of your destination on the page
    }, 'slow');
});
36 голосов
/ 22 сентября 2015

Или, для меньшего количества кода, внутри вашего клика вы размещаете:

setTimeout(function(){ 

$('#DIV_ID').scrollTop(0);

}, 500);
4 голосов
/ 03 марта 2010

Вы можете просто использовать:

<div id="GridDiv">
// gridview inside...
</div>

<a href="#GridDiv">Scroll to top</a>
1 голос
/ 23 апреля 2019

Особая благодарность Stoic за

   $("#miscCategory").animate({scrollTop: $("#miscCategory").offset().top});
1 голос
/ 11 февраля 2017

Я не знаю почему, но вы должны добавить setTimeout, по крайней мере, для меня 200ms:

setTimeout( function() {$("#DIV_ID").scrollTop(0)}, 200 );

Протестировано с Firefox / Chrome / Edge.

0 голосов
/ 06 сентября 2017

Используйте следующую функцию

window.scrollTo(xpos, ypos)

Здесь требуется xpos. Координата для прокрутки по оси x (по горизонтали) в пикселях

Требуется также ypos. Координата для прокрутки по оси y (по вертикали) в пикселях

...