jQuery - Como rolar uma âncora para o topo da página quando clicada?

Tenho uma lista de links emdiv elements e estou usando o dropcontent.js para carregar o conteúdo em outrodiv quando um link é clicado. Agora, gostaria de adicionar um código que role o link clicado até a parte superior da janela do navegado

HTML é assim para cada item da lista:

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

Encontrei tutoriais para rolar para um ID quando um link é clicado (tornando o href o ID da div que você deseja rolar - infelizmente não posso fazer isso, pois meu href é na verdade uma página html separada, embora está usando o dropcontent para carregá-lo na página atual.

Também encontrei um tutorial para rolar para um ID específico no carregamento da página, mas nenhum que simplesmente diga que quando uma âncora de uma determinada classe é clicada, role-a até a parte superior da janela do navegado

Alguém pode me ajudar com este, por favor? obrigado

ATUALIZAR

Eu tenho o pergaminho funcionando usando o seguinte código:

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

No entanto, meu dropcontent.js não está mais funcionando ... Acho que porque tenho 2 funções ocorrendo no mesmo clique ... Gostaria que o conteúdo fosse carregado primeiro e depois rol

aqui está meu 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")
}

});

Então agora eu só preciso integrar esses 2 bits de código para fazê-los funcionar juntos ... até agora não tive sorte em fazer isso - se eu adicionar a função scroll (animar), a função load parará de funcionar ...

UPDATE 2

Acontece que havia outra coisa que estava causando o problema - agora estou funcionando!

questionAnswers(3)

yourAnswerToTheQuestion