jQuery - Comment faire défiler une ancre en haut de la page quand on clique dessus?

J'ai une liste de liens dans div éléments et je suis en utilisant dropcontent.js pour charger le contenu dans un autre div lorsque le lien est cliqué. Je voudrais maintenant ajouter un bout de code qui permet de faire défiler le lien cliqué en haut de la fenêtre du navigateur.

HTML est comme ça, pour chaque élément dans la liste:

<div class="work">
    <h3><a class="scroll" href="project2.html">Project 2</a></h3>
    <div class="projectIntro">
        <p>This is some intro text for project 2</p>
    </div>
    <div class="pictures"></div>
</div>

J'ai trouvé des tutoriels pour défiler à un numéro d'identification lorsque le lien est cliqué (en faisant le href de l'ID de la div que vous voulez faire défiler à - malheureusement, je ne peux pas faire ce que ma href est en fait une page html distincte (même si c'est à l'aide de dropcontent pour le charger dans la page en cours.

J'ai aussi trouvé un tutoriel pour le défilement à un ID particulier au chargement de la page, mais rien que le fait de simplement dire que lorsqu'un point d'ancrage d'une classe donnée est cliqué, faites défiler jusqu'en haut de la fenêtre du navigateur.

Quelqu'un peut m'aider avec celui-ci, s'il vous plaît? merci.

Mise à JOUR:

J'ai le défilement de travail en utilisant le code suivant:

$('.work a').click(function() {
         $('html,body').animate({scrollTop: $(this).offset().top}, 500);
         }); 

Cependant, mon dropcontent.js ne fonctionne plus... je pense que parce que j'ai 2 fonctions présentes sur le même clic... je voudrais que le contenu de charger d'abord, puis faites défiler jusqu'.

voici mon dropcontent.js

$('.work a').click(function(event) {
event.preventDefault();

var parent = $(this).parents(".work");
var content_holder = parent.children(".pictures");

if (parent.hasClass("selected_work")) {
  close_other();
  return;
}

close_other();

parent.addClass("selected_work");
content_holder.load(this + " #content .work");

$('.selected_work img').attr("src", "images/arrow_close.gif");

});


function close_other() {

var selected_work = $('.selected_work');

selected_work.children('.pictures').empty();    
$('.selected_work img').attr("src", "images/arrow_open.gif");
selected_work.removeClass("selected_work")
}

});

Alors maintenant, j'ai juste besoin d'intégrer ces 2 bits de code pour les amener à travailler ensemble... pour l'instant non, je n'ai pas eu de chance ce faire - si j'ajoute le défilement (animer) de la fonction, la fonction de charge des arrêts de travail...

Mise à JOUR 2

S'avère que c'était quelque chose qui était à l'origine du problème - je avoir de travail!

OriginalL'auteur Spirit | 2011-12-02