Menu
I've got a JSP page like this:
<html><body>
<div id="mainContainer">
<div id="firstDisplayStuff">...</div>
<% out.flush(); %>
<div id="slowStuff">
<mytaglib:abc name='SlowBoat'>...</mytaglib>
</div>
</div>
<div id="floatRightContainer>
<div id="endingDisplayStuff">...</div>
<div>
</body></html>
When it hits the taglib, it takes forever, and that delay can not be avoided.
So using the out.flush(); I can at least display the firstDisplayStuff, but then the user just sits there looking at half a page while the taglib stuff runs. Only after that's done does the user see endingDisplayStuff.
I want firstDisplayStuff and endingDisplayStuff to both display right away.
But I figured that using jQuery, there would be a way to leave <div id="slowStuff"> blank, and then load it later.
What would the jQuery code look like to load <div id="slowStuff"> after both display stuff divs were showing? Where would I put the code? How would it be invoked?
EDIT : Added <div id=mainContainer> and <div id=floatRightContainer> into the existing example.
316
You don't need JavaScript for this. Just place the last div before the slow one, and use CSS to arrange the divs on the screen as it suits you:
<html><body>
<div id="firstDisplayStuff">...</div>
<div id="endingDisplayStuff">...</div>
<% out.flush(); %>
<div id="slowStuff" style="display: none;">
<mytaglib:abc name='SlowBoat'>...</mytaglib>
</div>
</body></html>
You can use a couple lines of code, called from body onload to get the slow div to where it belongs and then to show it. $('#slowStuff').insertAfter('#someDiv') to get it located in the right place, and $('#slowStuff').show(); to get it to show.
51
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
