Tengo una lista de enlaces endiv elements y estoy usando dropcontent.js para cargar contenido en otrodiv cuando se hace clic en un enlace. Ahora me gustaría agregar un código que desplaza el enlace en el que se hizo clic hasta la parte superior de la ventana del navegador.

HTML es así para cada elemento de la 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>

He encontrado tutoriales para desplazarse a una ID cuando se hace clic en un enlace (haciendo que href sea la ID del div al que desea desplazarse; desafortunadamente no puedo hacer esto ya que mi href es en realidad una página html separada aunque está utilizando dropcontent para cargarlo en la página actual.

También encontré un tutorial para desplazarse a una ID particular en la carga de la página, pero ninguno que simplemente diga cuando se hace clic en un ancla de una clase determinada, desplácese a la parte superior de la ventana del navegador.

¿Alguien puede ayudarme con este por favor? Gracias

ACTUALIZAR

He funcionado el desplazamiento usando el siguiente código:

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

Sin embargo, mi dropcontent.js ya no funciona ... Creo que porque tengo 2 funciones que se producen en el mismo clic ... Me gustaría que el contenido se cargue primero, luego desplácese.

aquí está mi 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")
}

});

Así que ahora solo necesito integrar estos 2 bits de código para que funcionen juntos ... hasta ahora no, no he tenido suerte al hacer esto; si agrego la función de desplazamiento (animar), la función de carga deja de funcionar ... @

UPDATE 2

Resulta que era algo más que estaba causando el problema, ¡ahora lo tengo funcionando!