jquery - Responsive slidedown height on click -

this site: http://www.stilld.nl

scroll down portfolio en click on item. 2 things happens:

1. the details portfolio item clicked appear underneath portfolio,
2. the page scrolls down towards details of portfolio item.

this working fine, because make scroll down amount of pixels.

problem: scall down browser , you'll see portfolio turning item underneath each other. now, when click item scrolls down amount of pixels said had go down, that's not far enough right now.

my solution (which didn't work): instead of scrolling down number tried scrolling down class. should work, code isn't working. scrolls top of page. think happens because scrolling down called upon @ same time class appears (or maybe earlier) maybe code doesn't see class in time... hope make sence. first code (and using on :

$(document).ready(function(){ $(".portfolio").click(function () {     if ($('#'+$(this).attr('target')).is(':visible')){         $('#'+$(this).attr('target')).slideup();             } else {         $('.description').slideup();          $('#'+$(this).attr('target')).slidedown();                 $('html, body').animate({scrolltop: $('#targetwrapper').offset().top + 600 }, 600);     }  }); $(".close").click(function () {     $('.description').slideup();             $('html, body').animate({scrolltop: $('.p_img').offset().top }, 600); }); 

});

what want:

i want code transformed code scrolls down class or id. but, has happen after class or id has appeared. think should solution.

reedit

add float:left; on div#wrapper_portfolio have real height of portfolio

and change :

 $('html, body').animate({scrolltop: +($('#alldescriptions').offset().top) + 'px' }, 600);