Solved

Show ALERT-LIKE window for 10 seconds?

Posted on 2004-07-30
10
836 Views
Last Modified: 2012-06-27
Using JavaScript, I need to show an Alert-LIKE window for 10 seconds then automatically close it without slowing movement to the NEXT webpage. We're developing a web-based corporate application. Our users are complaining about the lack-of-visual-feedback when moving to certain web-pages which take a long-time to load (10-15 seconds). Their request ... the instant a hyperlink is clicked, they want an alert-like message to show for 10 seconds. However, the alert-like message CANNOT require a user-click (it must simply time out and close itself) and it CANNOT delay the movement to the next web page!

Anyone have any suggestions?

Solutions must work in IE 5.5.





0
Comment
Question by:volking
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 2
  • 2
  • 2
  • +4
10 Comments
 
LVL 8

Expert Comment

by:trevorhartman
ID: 11681748
I would use a pop up with a setTimeout("this.close()", 1000 * 10); in the source

-Trevor
0
 
LVL 4

Assisted Solution

by:reggi635
reggi635 earned 100 total points
ID: 11681788
Why not something like this:

<script>
      function Showprocessor() {
            document.all.VisibleForm.style.display = "none";
            document.all.UpdateMessage.style.display = "block";
            //document.frm.submit();
      }
</script>

<div id="UpdateMessage" style="display: none">
      <table height="200px" border="0" align="center">
            <tr>
                  <td height="75px">&nbsp;&nbsp;</td></tr>
            <tr>
                  <td valign="middle" align="center">
                        <img src="http://view.atdmt.com/CLH/view/trblftru00701185clh/direct/01/241204039" width="156" height="14" border="0">
                  </td>
            </tr>
            <tr>
                  <td valign="middle" align="center">
                        Processing.&nbsp;&nbsp;Please wait...
                  </td>
            </tr>
      </table>
</div>

<div id="VisibleForm">
      <!-- <form name="frm" action="URL" method="post"> -->
            <input type="Button" onclick="Showprocessor()" value="CONTINUE">
      <!-- </form> -->
</div>

You can add the same meesage that needs to show on the popup in the hidden section when its loaded.

REGGI
0
 
LVL 8

Expert Comment

by:trevorhartman
ID: 11681811
on a redirect sometimes the window is blank for a large part of the time, so that might not work so well...
0
The Ultimate Checklist to Optimize Your Website

Websites are getting bigger and complicated by the day. Video, images, custom fonts are all great for showcasing your product/service. But the price to pay in terms of reduced page load times and ultimately, decreased sales, can lead to some difficult decisions about what to cut.

 
LVL 36

Assisted Solution

by:Zyloch
Zyloch earned 100 total points
ID: 11681858
If you want it to look like an alert, here are some tips:

Through experimenting, I found that a color quite close to the alert was this:
#FDF5E6 or rgb(253,245,230);

Also, you should make the title something like:
<title>Microsoft Internet Explorer&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</title>
as you're going to resize the window anyways.

You should use window.open to open the window to this size approximately:
width=210,height=120

You can get the alert picture by taking screenshot of alert box and editing it in Paint with crop, etc.

You should set a margin for the <body>

Regards,
${Zyloch}
0
 
LVL 15

Assisted Solution

by:Thogek
Thogek earned 100 total points
ID: 11681954
To expand on trevorhartman's suggestion:

    <script language="JavaScript" type="text/javascript">
    function OpenProgressWindow() {
        var oWin = window.open('', '_blank', 'width=300,height=250,directories=no,location=no,menubar=no,resizable=no,scrollbars=no,status=no,toolbar=no');
        var oDoc = oWin.document;
        oDoc.open();
        oDoc.write('<html><body onload="setTimeout(\'window.self.close()\', 10*1000);">Add your message text or HTML markup here.</body></html>');
        oDoc.close();
    }
    </script>

    <a href="somewhere.html" onclick="OpenProgressWindow();">Click me!</a>

Of course, you can change to details (window size, popup document design, etc.) to suit whatever you need, including the option of making it look like a regular system/JavaScript dialog (as Zyloch suggested above), if you like.
0
 
LVL 15

Expert Comment

by:justinbillig
ID: 11684354
if you want it to act like an alert box dont use window.open because that will open the window modelessly meaning hte user can do stuff with the site while that window is open, if you want it to be like an alert box use window.showModalDialog( "PathToPage", objAnyValuesYouWantToPassToTheWindow, "Dialog Options )
0
 
LVL 15

Expert Comment

by:justinbillig
ID: 11684356
oh sorry i didnt read you request all the way =) stupid me
0
 
LVL 36

Expert Comment

by:Zyloch
ID: 11684584
But justin points out a good fact. You'd probably want to include something in the parent window, perhaps on onFocus in the parent body tag that tests if child window is opened, then set the focus to the child window.

Regards,
${Zyloch}
0
 
LVL 1

Accepted Solution

by:
_KM_ earned 200 total points
ID: 11688381
<script>
function Loading()
{
Popup = window.open("about:blank", "alert", "width=210,height=75");
Popup.document.write("<title>Loading...                                  </title><body bgcolor='#CCCCCC'><br><center><font size=+2>Please Wait...</font></center></body>");

}
function Finished()
{
Popup = window.open("about:blank", "alert", "width=210,height=120");
Popup.close();
}
</script>

<body onunload="Finished()">
<a href="http://www.somewhere.com/" onclick="Loading();">Load</a>
</body>


the only problem with that code is it will quickly flash up with a small popup for a fraction of a second as they leave the page if they dont use the link to leave - but you can put some form of validation in for that if you wanted
0
 

Expert Comment

by:dirakkk2
ID: 11691932
I think the simplest solution consists of creating a layer at the opening of the page
This layer will be designed and located as you like (This can even be an image)

then just call >>>setTimeout("get_element('myWaitingLayer').style.visibility='hidden';", 1000 * 10);
 
provided that the function get_element = document.all ?
      function (s_id) { return document.all[s_id] } :
      function (s_id) { return document.getElementById(s_id) };

Try this !

Yann
0

Featured Post

Transaction Monitoring Vs. Real User Monitoring

Synthetic Transaction Monitoring Vs. Real User Monitoring: When To Use Each Approach? In this article, we will discuss two major monitoring approaches: Synthetic Transaction and Real User Monitoring.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Article by: DanRollins
This article describes a JavaScript program that creates a maze made of hexagonal cells.  In Part 2 (http://www.experts-exchange.com/Programming/Languages/Scripting/JavaScript/A_7850-Hex-Maze-Part-2.html), we'll extend the program by adding a depth-…
This article discusses the difference between strict equality operator and equality operator in JavaScript. The Need: Because JavaScript performs an implicit type conversion when performing comparisons, we have to take this into account when wri…
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)
The viewer will learn the basics of jQuery including how to code hide show and toggles. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery…

717 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question