Comment faire défiler vers le haut d'un div en utilisant jquery?

J'ai un gridview dans une div ... Je veux faire défiler vers le haut de la div du fond de la div en utilisant jquery ... Toute suggestion ....Comment faire défiler vers le haut d'un div en utilisant jquery?

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

Mon gridview aura personnalisée linkbuttons généré dans la pagination ... Je vais faire défiler vers le haut de la div du fond sur le bouton de clic ... lien

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);

au lieu de javascript i ll appelle la fonction jquery ... Toute suggestion ...

EDIT:

Exactement comme les questions Stackoverflow par page utilisateur ... Lorsque vous modifiez la page n ° il défile en haut avec effet lisse .... Je veux acheive que ...

Source

2010-03-03 Chendur Pandian

Peut-être que je suis mal compris, mais pourquoi n'utilisez-vous pas simplement des ancres de page? –

Vous pouvez simplement utiliser:

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

<a href="#GridDiv">Scroll to top</a>

Source

2010-03-03 06:03:28

Vous n'avez pas besoin des ancres. Il suffit d'aller à #GridDiv. –

+30

+1 pour une solution techniquement brillante au problème de l'utilisateur ... mais complètement inutile à quiconque cherche une réponse à la question réelle. (Anchors ne résout pas mon problème, j'ai besoin de faire défiler l'écran vers le haut d'un div en utilisant javascript! - Se plaindre parce que c'était top google résultat pour moi) – RonLugge

@RonLugge Dans ce cas, la réponse de Greg Mathews pourrait aider. Essayez de définir ou d'animer la propriété 'scrollTop'. –

148

Voici ce que vous pouvez faire en utilisant 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'); 
});

Source

2012-01-11 00:30:02

génial, vous devriez obtenir 100 upvotes pour cela. – Prateek

C'est parfait. – BaconJuice

Pourquoi y a-t-il une valeur codée en dur de "- 20"? – citress

Ou, pour moins de code, dans votre clic vous placez:

setTimeout(function)({ $('#DIV_ID').scrollTop(0); }, 500);

Source

2015-09-22 16:08:08

Cela ne fonctionne pas dans jQuery 2.2.0. Mais la réponse avec 116 votes fait. –

Vous devez ajouter un 'setTimeout' pour le faire fonctionner:' setTimeout (fonction) ({$ ('# DIV_ID'). ScrollTop (0);}, 500); ' –

Merci Londres, je vais modifier ensuite, semble que les choses ont changé –

Je ne sais pas pourquoi, mais vous devez ajouter un setTimeout avec au moins pour moi 200ms:

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

testé avec Firefox/Chrome/Edge.

Source

2017-02-11 12:59:04

Utilisez la fonction suivante

window.scrollTo(xpos, ypos)

XPos Voici requis. La coordonnée à faire défiler jusqu'à, le long de l'axe des x (horizontal), en pixels

ypos est également requis. La coordonnée vers laquelle défiler, le long de l'axe y (vertical), en pixels

Source

2017-09-06 11:53:02

Comment faire défiler vers le haut d'un div en utilisant jquery?

Répondre

Questions connexes