|
|||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
|
|||||||||||||||||||||||||||||||||||||||||||||||||||||||||||
|
Announcements
Want a new Job?
Chapters
Services
Feature Zones
|
IntroductionEver wish you could replace that unsightly grey box displayed while your Java applet is loading with a message to the user? The following code provides a solution for IE and Netscape. A more complete description follows the code. <html> <head> <title>Your Title Here</title> </head> <script language="JavaScript"> <!-- Hide script from old browsers function init() { // Microsoft Internet Explorer if (document.all) { document.all.loading.style.visibility="hidden"; document.all.myapplet.style.visibility="visible"; document.applets[0].repaint(); } // Netscape Navigator else { document.loading.visibility="hide"; document.myapplet.visibility="visible"; } } // --> </script> <style type="text/css"> #loading { position:absolute; left:150; top:200; } #myapplet { position:absolute; left:10; top:10; visibility:hide; } </style> <body onLoad="init()"> <div id="loading"> <p>Please wait while Java applet loads...</p> </div> <div id="myapplet" style="visibility:hidden"> <applet archive="app1.jar" code="app1.class" align="baseline" width="620" height="442"> <p>Requires a browser that supports Java.</p> </applet> </div> </body> </html> The Solution ExplainedFirst, let's explain exactly what we're trying to do here. We want a message, such as "Please wait while Java applet loads..." to be displayed while the applet is being loaded. This message should appear in the space that will be occupied by the applet, then be replaced by the applet once the applet has loaded. The code shown above does a number of things to accomplish this.
Two <div id="loading"> <p>Please wait while Java applet loads...</p> </div> <div id="myapplet" style="visibility:hidden"> <applet archive="app1.jar" code="app1.class" align="baseline" width="620" height="442"> <p>Requires a browser that supports Java.</p> </applet> </div>
Style sheets are defined for the two <style type="text/css"> #loading { position:absolute; left:150; top:200; } #myapplet { position:absolute; left:10; top:10; visibility:hide; } </style>
A JavaScript function is defined which is run when the page loads
( <script language="JavaScript"> function init() { if (document.all) { document.all.loading.style.visibility="hidden"; document.all.myapplet.style.visibility="visible"; document.applets[0].repaint(); } else { document.loading.visibility="hide"; document.myapplet.visibility="visible"; } } </script> This method should work equally well to place an image "over" the applet while it's loading.
|
||||||||||||||||||||||||||||||||||||||||||||||||||||||||||