IE7 / IE8 scroll bar not recalculating content height, when using .slideToggle();

IE7 / IE8 scroll bar not recalculating content height, when using .slideToggle();

Hi,

IE7 / IE8 scroll bar is not recalculating content height, when using .slideToggle(); so content panels when expanded are lost off the bottom of the page - see screenshot.

Has anyone else had this problem? What is the fix?

I have tested in Chrome, firefox, opera (it even works in IE6) just not IE 7 and 8...

I have attached a screenshot. The weird thing is the slider I am using for the areas causing the problem (pictured) I am using because they allow multiple instances of the slider on the page. 

There is also an old one on the page also that does work in IE7 & 8 (the page expands as if there was new content in the page).

This page is a prototype so it is not perfect.

Here is the onload.js

  1. $(document).ready(function() {
  2.  
  3. // This slider works and the content increases the scrollbar length in IE7 & 8

  5.   $('#basic-proposal-details-slider').hide();

  7. $('#basic-proposal-details-toggle').click(function() {
  8. $('#basic-proposal-details-slider').slideToggle(); 
  9. $(this).toggleClass("active");
  10. $(this).text(($('#basic-proposal-details-toggle').text() == 'Hide Details') ? 'Show Details' : 'Hide Details');
  11. return false;
  12. });

  14. // The below slider functions DO NOT increase the scrollbar length in IE7 & 8

  16. /* SLIDERS FOR BUDGET FORMS */
  18. $("#2").hide();
  19. $("#3").hide();
  21. $(".staff-record-wrap").hide();
  23. $("div.budget-form-section-title").click(function(){
  24. $(this).next().slideToggle();
  25. });
  27. $("div.budget-form-section-title h4").click(function(){
  28. $(this).toggleClass("active");
  29. });
  31. /* SLIDER FOR STAFF RECORDS */
  33. $("div.staff-record").click(function(){
  34. $(this).next().slideToggle();
  35. });
  37. $("div.staff-record h4").click(function(){
  38. $(this).toggleClass("active");
  39. });

  41. });
This is totally baffling me especially since it works everywhere but IE 7 & 8. I hope someone knows what is going on... It a bit of UI blocker...

Thank you in advance.

Matt