A couple of things:
- Your
.slideDown()
s use the speedfast
, but you're only delaying by500
ms.fast
is synonymous with600
ms. In general, I think it's a bad idea to use both as it's very confusing to someone reading your code whatfast
is. - Rather than using
.delay()
method, I'd use thecomplete
argument on theslideDown
orslideUp
s, so that once they're complete, you do your scrolling. This makes more sense, as you'd then not have to worry about conflicting timings. - My guess would be that your problem is caused by your transitions taking 600ms, but your scroll only waiting 500ms. At 500ms, it's getting the wrong offset values and scrolling to those.
Perhaps you should consider changing your markup to something like:
$(this).parent().find('.proj_content').slideDown('600', function() { // Slide the project to the top after clicking on it $('html, body').animate({ scrollTop: $(this).parent().offset().top }, 500); });
* Note: I've changed fast
to 600
for clarity's sake.