Website hangs (white page or xxx items remaining) in IE7 after a few pageloads

sednax
sednax used Ask the Experts™
on
Hi everyone,

I'm on a loss here, busy with this for over 3 days now.

On IE7 (WinXP and sometimes Vista, Windows 7 works most of the time -> yes it's OS
dependant??) my website loads a few times and then starts to load really slow. A
blank page appears (but keeps loading), the refresh button doesn't work and some (not all)
images don't load anymore and get the message "xx items remaining".

I tried EVERYTHING, removing ALL javascript: doesn't work
removing ALL css: doesn't work
removing parts of the code, didn't work either. I cannot seem to find the problem.

Could anyone help me? The problem occurs on ALL pages, but only after a few pageloads.  
I attached the source of one page, all other pages have the same header and footer.

Thanks a lot :)
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> 
<html> 
<head> 
<meta http-equiv="content-type" content="text/html; charset=utf-8"> 
<meta name="SKYPE_TOOLBAR" content="SKYPE_TOOLBAR_PARSER_COMPATIBLE"> 
<link rel="shortcut icon" href="favicon.ico"> 
<link rel="stylesheet" href="http://internal.brainrack.com/layout.css"> 
 
</head> 
<body> 
<script type="text/javascript" src="http://internal.brainrack.com/js/scripts.js"></script> 
<div class=portal id="portal"> 
    <div class="mylogo"> 
        <a href="http://internal.brainrack.com/"><img src="http://internal.brainrack.com/images/logo.jpg" border=0></a> 
    </div> 
    <div class="myportal"> 
        <div> 
            <p>                &nbsp;&nbsp;&nbsp;
                <a href="http://internal.brainrack.com/logout"><img src="http://internal.brainrack.com/images/2/logout.gif">Logout</a> 
            </p> 
            <img width="120" src="http://internal.brainrack.com/upload/images/tn_1000120483.png" border=0>        </div> 
    </div> 
    <div class="clear"></div> 
    <div class="maincontent"> 
    <ul class="dashboard"> 
        <li><a class=selected href="http://internal.brainrack.com/dashboard">Dashboard</a></li> 
        <li><a  href="http://internal.brainrack.com/dashboard/crowd">Users</a></li> 
        <li><a  href="http://internal.brainrack.com/dashboard/editOrganization">Settings</a></li> 
    </ul> 
<div class=dashboard><div class="mainLeft"> 
    <h1>Statistics</h1> 
    <table class="mainLeft" cellpadding="0" cellspacing="0"> 
        <tr 
            onmouseover="showDiv('userview')"
            onmouseout="hideDiv('userview')"
            > 
            <td>Users:</td> 
            <td> 
                <div class="left"> 
                    9                </div> 
                <div id="userview" class="left" style="display:none;padding-left:10px"> 
                    <a href="http://internal.brainrack.com/dashboard/crowd">view</a> 
                </div> 
                <div class="clear"></div> 
            </td> 
        </tr> 
        <tr 
            onmouseover="showDiv('outview')"
            onmouseout="hideDiv('outview')"
            > 
            <td>Outstanding invitations:</td> 
            <td> 
                <div class="left"> 
                    16                </div> 
                <div id="outview" class="left" style="display:none;padding-left:10px"> 
                    <a href="http://internal.brainrack.com/dashboard/invites">view</a> 
                </div> 
                <div class="clear"></div> 
            </td> 
        </tr> 
        <tr><td class="seperator">Open challenges:</td><td class="seperator">0</td></tr> 
        <tr><td>Challenges under review:</td><td width="70">0</td></tr> 
        <tr><td>Closed challenges:</td><td>1</td></tr> 
        <tr><td class="seperator" colspan="2"> 
 
                <table class="mainLeftRanking" cellspacing="0" cellpadding="0" width="100%"> 
                    <tr><td class="th">Rank</td><td class="th">Name</td><td class="th">Points</td></tr> 
                                            <tr> 
                            <td>1</td> 
                            <td>martine boetje</td> 
                            <td class="points">30</td> 
                        </tr> 
                                            <tr> 
                            <td>2</td> 
                            <td>Simone Herrewijn</td> 
                            <td class="points">10</td> 
                        </tr> 
                                    </table> 
<p align="right"><a href="http://internal.brainrack.com/dashboard/rankings">View all rankings</a></p> 
            </td></tr> 
    </table> 
</div> 
<div class="mainRight"> 
    <div class="left" style="width:345px"> 
        <h1 class="hello">hi</h1> 
        <h2 class="hello">name</h2> 
    </div> 
    <div class="right" style="width:145px;position:relative;left:-20px"> 
        
        <a 
            href="http://internal.brainrack.com/dashboard/createChallenge"
            onmouseover="changeImg('createCha','http://internal.brainrack.com/images/2/createCha2.gif')"
            onmouseout="changeImg('createCha','http://internal.brainrack.com/images/2/createCha.gif')"
            > 
            <img id="createCha" src="http://internal.brainrack.com/images/2/createCha.gif"> 
        </a> 
                <a 
            href="http://internal.brainrack.com/dashboard/userManagement"
            onmouseover="changeImg('iu','http://internal.brainrack.com/images/2/invite.gif')"
            onmouseout="changeImg('iu','http://internal.brainrack.com/images/2/inviteNo.gif')"
            > 
            <img id="iu" src="http://internal.brainrack.com/images/2/inviteNo.gif"> 
        </a> 
        <br /> 
        </div> 
    <div class="clear"></div> 
    <br /> 
                                        <div 
    class="challengeBoxD"
    id="40box"
    > 
    <div class="dBoxText" style="width:390px"> 
        <a href="http://internal.brainrack.com/dashboard/viewChallenge/40"><h1 class="dBox">Hoe kan Bijlesnetwerk jullie beter ondersteunen?</h1></a> 
        <p class="dBox"> 
            Deadline: 26 September 2010<br /> 
            Solutions: 3<br /> 
                    </p> 
    </div> 
    <div class="dBoxEI"> 
        <div class="challengeBoxSep"></div> 
                                <div class="challengeBoxDaysD">Closed</div> 
            </div> 
    <div class="clear"></div> 
</div>                </div> 
<div class="clear"></div></div></div></div></div> 
</div> 
<div id="footer"> 
    <div id="footerIn"> 
        <div id="footerImg"> 
            <img src="/images/2/footerHead.gif"> 
        </div> 
        <div id="footerItem"> 
            <h2>Legal</h2> 
            <ul> 
                <li><a href="/Terms_of_use">Terms of use</a></li> 
                <li><a href="/Privacy_policy">Privacy policy</a></li> 
            </ul> 
        </div> 
        <div id="footerItem"> 
            <h2>Company</h2> 
            <ul> 
                <li><a href="/About_us">About us</a></li> 
                <li><a href="/Press">Press</a></li> 
                <li><a href="/Careers">Careers</a></li> 
                <li><a href="/Executive_team">Executive team</a></li> 
            </ul> 
        </div> 
        <div id="footerItem"> 
            <h2>Businesses</h2> 
            <ul> 
                <li><a href="/Organizations">Organizations</a></li> 
            </ul> 
        </div> 
        <div id="footerItem"> 
            <h2>Account</h2> 
            <ul> 
                <li><a href="/register">Register</a></li> 
                <li><a href="/login">Login</a></li> 
                <li><a href="/sa">Student ambassadors</a></li> 
            </ul> 
        </div> 
        <div class="clear"></div> 
        <br><br> 
        <hr> 
 
        <div id="footerPartners"> 
            <h2 style="text-align:left">Brainrack is supported by:</h2> 
            <a href="http://www.ru.nl/english/"><img src="/images/2/rulogo.gif"></a> 
            <a href="http://brandery.org/"><img src="/images/2/branderylogo.gif"></a> 
            <a href="http://www.cincytechventures.com/content/cincytech-home"><img class="last" src="/images/2/rhlogo.gif"></a> 
        </div> 
        <br> 
        <hr> 
        <br><br><br> 
    </div> 
</div> 
<script type="text/javascript"> 
 
  var _gaq = _gaq || [];
  _gaq.push(['_setAccount', 'UA-16477512-1']);
  _gaq.push(['_trackPageview']);
 
  (function() {
    var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
    ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
    var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
  })();
 
 
 
    window.onload=function(){
Nifty('ul.dashboard a','normal top');
        Nifty('div.roundCornerUM','normal');
        footerheight();
    }</script></body> 
 
</html>

Open in new window

Comment
Watch Question

Do more with

Expert Office
EXPERT OFFICE® is a registered trademark of EXPERTS EXCHANGE®

Commented:
I know this is going to be trial and error but i noticed the top few tags are not closed.  I run your site through the
w3c validator and it said that you head tag was not closed.  I can see that it is but wondered if this is because of these first few tags. Try changing:

<meta http-equiv="content-type" content="text/html; charset=utf-8">
<meta name="SKYPE_TOOLBAR" content="SKYPE_TOOLBAR_PARSER_COMPATIBLE">
<link rel="shortcut icon" href="favicon.ico">
<link rel="stylesheet" href="http://internal.brainrack.com/layout.css">

to

<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<meta name="SKYPE_TOOLBAR" content="SKYPE_TOOLBAR_PARSER_COMPATIBLE" />
<link rel="shortcut icon" href="favicon.ico" />
<link rel="stylesheet" href="http://internal.brainrack.com/layout.css" />

Commented:
failing that paste your code into

http://validator.w3.org/check

and work through the recommendations.
@Ross-C his doctype is HTML4 strict which does not support self closing tags... I would be a bit more methodical and, as you say, remove all Javascript scripts *and* calls from the page and see if it loads ok.

What jumps out to me is the placement of the first JS to be loaded - you have put that after your body tag and not in the page head - is this deliberate? If not then you might find circular references with your onload at the foot.... if it's not essential to have in the body (i.e. it's not writing directly onto the page) then try it in the <head> section  like below:




<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> 
<html> 
<head> 
<meta http-equiv="content-type" content="text/html; charset=utf-8"> 
<meta name="SKYPE_TOOLBAR" content="SKYPE_TOOLBAR_PARSER_COMPATIBLE"> 
<link rel="shortcut icon" href="favicon.ico"> 
<link rel="stylesheet" href="http://internal.brainrack.com/layout.css"> 
 <script type="text/javascript" src="http://internal.brainrack.com/js/scripts.js"></script> 
</head> 
<body> 

<div class=portal id="portal"> 
    <div class="mylogo"> 
        <a href="http://internal.brainrack.com/"><img src="http://internal.brainrack.com/images/logo.jpg" border=0></a> 
    </div> 
    <div class="myportal"> 
        <div> 
            <p>                &nbsp;&nbsp;&nbsp;
                <a href="http://internal.brainrack.com/logout"><img src="http://internal.brainrack.com/images/2/logout.gif">Logout</a> 
            </p> 
            <img width="120" src="http://internal.brainrack.com/upload/images/tn_1000120483.png" border=0>        </div> 
    </div> 
    <div class="clear"></div> 
    <div class="maincontent"> 
    <ul class="dashboard"> 
        <li><a class=selected href="http://internal.brainrack.com/dashboard">Dashboard</a></li> 
        <li><a  href="http://internal.brainrack.com/dashboard/crowd">Users</a></li> 
        <li><a  href="http://internal.brainrack.com/dashboard/editOrganization">Settings</a></li> 
    </ul> 
<div class=dashboard><div class="mainLeft"> 
    <h1>Statistics</h1> 
    <table class="mainLeft" cellpadding="0" cellspacing="0"> 
        <tr 
            onmouseover="showDiv('userview')"
            onmouseout="hideDiv('userview')"
            > 
            <td>Users:</td> 
            <td> 
                <div class="left"> 
                    9                </div> 
                <div id="userview" class="left" style="display:none;padding-left:10px"> 
                    <a href="http://internal.brainrack.com/dashboard/crowd">view</a> 
                </div> 
                <div class="clear"></div> 
            </td> 
        </tr> 
        <tr 
            onmouseover="showDiv('outview')"
            onmouseout="hideDiv('outview')"
            > 
            <td>Outstanding invitations:</td> 
            <td> 
                <div class="left"> 
                    16                </div> 
                <div id="outview" class="left" style="display:none;padding-left:10px"> 
                    <a href="http://internal.brainrack.com/dashboard/invites">view</a> 
                </div> 
                <div class="clear"></div> 
            </td> 
        </tr> 
        <tr><td class="seperator">Open challenges:</td><td class="seperator">0</td></tr> 
        <tr><td>Challenges under review:</td><td width="70">0</td></tr> 
        <tr><td>Closed challenges:</td><td>1</td></tr> 
        <tr><td class="seperator" colspan="2"> 
 
                <table class="mainLeftRanking" cellspacing="0" cellpadding="0" width="100%"> 
                    <tr><td class="th">Rank</td><td class="th">Name</td><td class="th">Points</td></tr> 
                                            <tr> 
                            <td>1</td> 
                            <td>martine boetje</td> 
                            <td class="points">30</td> 
                        </tr> 
                                            <tr> 
                            <td>2</td> 
                            <td>Simone Herrewijn</td> 
                            <td class="points">10</td> 
                        </tr> 
                                    </table> 
<p align="right"><a href="http://internal.brainrack.com/dashboard/rankings">View all rankings</a></p> 
            </td></tr> 
    </table> 
</div> 
<div class="mainRight"> 
    <div class="left" style="width:345px"> 
        <h1 class="hello">hi</h1> 
        <h2 class="hello">name</h2> 
    </div> 
    <div class="right" style="width:145px;position:relative;left:-20px"> 
        
        <a 
            href="http://internal.brainrack.com/dashboard/createChallenge"
            onmouseover="changeImg('createCha','http://internal.brainrack.com/images/2/createCha2.gif')"
            onmouseout="changeImg('createCha','http://internal.brainrack.com/images/2/createCha.gif')"
            > 
            <img id="createCha" src="http://internal.brainrack.com/images/2/createCha.gif"> 
        </a> 
                <a 
            href="http://internal.brainrack.com/dashboard/userManagement"
            onmouseover="changeImg('iu','http://internal.brainrack.com/images/2/invite.gif')"
            onmouseout="changeImg('iu','http://internal.brainrack.com/images/2/inviteNo.gif')"
            > 
            <img id="iu" src="http://internal.brainrack.com/images/2/inviteNo.gif"> 
        </a> 
        <br /> 
        </div> 
    <div class="clear"></div> 
    <br /> 
                                        <div 
    class="challengeBoxD"
    id="40box"
    > 
    <div class="dBoxText" style="width:390px"> 
        <a href="http://internal.brainrack.com/dashboard/viewChallenge/40"><h1 class="dBox">Hoe kan Bijlesnetwerk jullie beter ondersteunen?</h1></a> 
        <p class="dBox"> 
            Deadline: 26 September 2010<br /> 
            Solutions: 3<br /> 
                    </p> 
    </div> 
    <div class="dBoxEI"> 
        <div class="challengeBoxSep"></div> 
                                <div class="challengeBoxDaysD">Closed</div> 
            </div> 
    <div class="clear"></div> 
</div>                </div> 
<div class="clear"></div></div></div></div></div> 
</div> 
<div id="footer"> 
    <div id="footerIn"> 
        <div id="footerImg"> 
            <img src="/images/2/footerHead.gif"> 
        </div> 
        <div id="footerItem"> 
            <h2>Legal</h2> 
            <ul> 
                <li><a href="/Terms_of_use">Terms of use</a></li> 
                <li><a href="/Privacy_policy">Privacy policy</a></li> 
            </ul> 
        </div> 
        <div id="footerItem"> 
            <h2>Company</h2> 
            <ul> 
                <li><a href="/About_us">About us</a></li> 
                <li><a href="/Press">Press</a></li> 
                <li><a href="/Careers">Careers</a></li> 
                <li><a href="/Executive_team">Executive team</a></li> 
            </ul> 
        </div> 
        <div id="footerItem"> 
            <h2>Businesses</h2> 
            <ul> 
                <li><a href="/Organizations">Organizations</a></li> 
            </ul> 
        </div> 
        <div id="footerItem"> 
            <h2>Account</h2> 
            <ul> 
                <li><a href="/register">Register</a></li> 
                <li><a href="/login">Login</a></li> 
                <li><a href="/sa">Student ambassadors</a></li> 
            </ul> 
        </div> 
        <div class="clear"></div> 
        <br><br> 
        <hr> 
 
        <div id="footerPartners"> 
            <h2 style="text-align:left">Brainrack is supported by:</h2> 
            <a href="http://www.ru.nl/english/"><img src="/images/2/rulogo.gif"></a> 
            <a href="http://brandery.org/"><img src="/images/2/branderylogo.gif"></a> 
            <a href="http://www.cincytechventures.com/content/cincytech-home"><img class="last" src="/images/2/rhlogo.gif"></a> 
        </div> 
        <br> 
        <hr> 
        <br><br><br> 
    </div> 
</div> 
<script type="text/javascript"> 
 
  var _gaq = _gaq || [];
  _gaq.push(['_setAccount', 'UA-16477512-1']);
  _gaq.push(['_trackPageview']);
 
  (function() {
    var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
    ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
    var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
  })();
 
 
 
    window.onload=function(){
Nifty('ul.dashboard a','normal top');
        Nifty('div.roundCornerUM','normal');
        footerheight();
    }</script></body> 
 
</html>

Open in new window

Commented:
Sorry for the late reply. I found the solution!

Ross: As bluegohzt pointed out: self-closing tags are not allowed in html strict. When you use <img src="" /> on a html strict page it will crash IE6 (I had this problem before!).  The w3c error was because there was no title tag in the head, which is required in html strict. This was not the problem though..

blueghozt: I did that and even when I removed *all* JS and CSS includes the problem still persisted.

The solution was not in this code, it was so stupid. I block all files with .htaccess, with the exception of the files that are needed to run the website (like index.php, I do this to block a system folder for example). I forgot to include one file in the list of exceptions which is called on one page and IE got stuck in an infinte redirect loop also caused by the .htaccess. All other browsers quit this loop and go on loading the rest of the page after xx tries, but IE doesn't and even when browsing to another page doesn't stop the redirect. So IE crashes.

Really stupid, I found it out with fiddler2 (great tool for if you don't know it!)

Thank you both for your input!
TolomirAdministrator
Top Expert 2005

Commented:
This question has been classified as abandoned and is being closed as part of the Cleanup Program. See my comment at the end of the question for more details.

Do more with

Expert Office
Submit tech questions to Ask the Experts™ at any time to receive solutions, advice, and new ideas from leading industry professionals.

Start 7-Day Free Trial