Please wait message - Browsers

alpine · April 12, 2006

Hi,

I want to show users a message after they click a link where i am using php's sleep() function to delay link prosessing (example: on login)

I have this javascript
[code]
<script type="text/javascript">
function do_wait()
{
document.all.pleasewait.style.pixelTop = (document.body.scrollTop + 50);
document.all.pleasewait.style.visibility="visible";
}
</script>
[/code]

and this message
[code]
<div id="pleasewait" style="position:absolute;z-index:5;top:50;left:42%;visibility:hidden">
<table bgcolor="#000000" border="1" bordercolor="#DDDDDD" cellpadding="0" cellspacing="0" height="150" width="200" id="Table1">
<tr>
<td width="100%" height="100%" bgcolor="#ECF0F6" align="center" valign="middle">
<font color="#FF0000"><b>Verifying data<br /><br />please wait........</b></font>
</td>
</tr>
</table>
</div>

// link
<a href='whatever.php' onclick='do_wait()'>Click here to proceed</a>

[/code]

Now, in my php scripts i include files such as the header that includes tags such as html - head - body

What happends is that when i put the do_wait() function inside the header file along with my other javasripts, it wont work on either of the browsers...!... (?)

If i put the do_wait() above the header inclusion, it works on both browsers (havent tested any other browsers yet). But when i do this, i do write a javascript even before the - html - start tag....??? This isn't good coding....

When i write the do_wait() function after the header inclusion, Firefox wont show the message but IE6 shows it ok.

I myself prefer Firefox and even if most visitors use IE i still want the message to apply to the most common browsers.

Any comments and help on this ??

alpine · April 12, 2006

puzzled further with the javascript after studying other cross browser codes, and now it works when it is located in the header (as it should), AND works in Firefox, Opera, IE6 and Netscape :)

Only problem seems to be the height parameters returned differently in IE and it ignores scroll parametres set.

[code]
function do_wait()
{
if (document.getElementById)
{
document.getElementById('pleasewait').style.pixelTop = (document.body.scrollTop + 50);
document.getElementById('pleasewait').style.visibility='visible';
}
if (document.layers)
{
document.pleasewait.pixelTop = (document.body.scrollTop + 50);
document.pleasewait.visibility='visible';
}
else
{
document.all.pleasewait.style.pixelTop = (document.body.scrollTop + 180);
document.all.pleasewait.style.visibility='visible';
}
}
[/code]

buceta · May 1, 2006

Hi,

I have an question about this script.. I want a loading message to my ajax system, like in gmail.

This script using css absolute, work fine, but not work like the gmail div. I want that messate stay always on top if user down or up scroll bar.

My english is very poor, sorry. You understand my question?

buceta · May 2, 2006

Then anyone have the solution?

GBS · May 3, 2006

Hi,

That one could help you, (taken from an other website, & made some little modifications)
[code]
<html>
<head>
<title>still testing,,,</title>
</head>
<script src="topmsg.js">
//Always-on-top message Script- © Dynamic Drive (www.dynamicdrive.com)
//For full source code, and Terms Of use, visit dynamicdrive.com
//This credit MUST stay intact for use
//Answ: ok,... no prob,,;)
</script>
<body>
<script type="text/javascript">
// some vars
var status=new Array();
status['popup']="hidden";
status['popup_init']="no";

function do_wait()
{
if (status['popup_init']=="no")
    {
// if not done, we init the message once
    setmessage();
    status['popup_init']="done";
    }
if (status['popup'] == "visible")
    {
    status['popup'] = "hidden";
    }
else
    {
    status['popup'] = "visible";
    }
if (document.getElementById)
    {
    eval("document.getElementById('pleasewait').style.visibility=\""+status['popup']+"\"");
    }
if (document.layers)
    {
    eval("document.pleasewait.visibility=\""+status['popup']+"\"");
    }
else
    {
    eval("document.all.pleasewait.style.visibility=\""+status['popup']+"\"");
    }
}
</script>

// link
<a href=# onclick='do_wait()'>Click here to proceed</a>

<div id="contents"></div>
<script>
//to populate the page
var content="";
for (i=0;i<50;i++)
    {
    content=content+"<br>line number "+i;
    }
document.getElementById('contents').innerHTML=content;
</script>
</body>
</html>
[/code]
& 'topmsg.js' file can be about:
[code]

//enter the message you wish to be shown, including html tags

var message='<table id="pleasewait" style="z-index:5;" bgcolor="#000000" border="1" bordercolor="#DDDDDD" cellpadding="0" cellspacing="0" height="150" width="200" id="Table1">';
message=message+'<tr>';
message=message+'<td width="100%" height="100%" bgcolor="#ECF0F6" align="center" valign="middle">';
message=message+'<font color="#FF0000"><b>Verifying data<br /><br />please wait........</b></font>';
message=message+'</td>';
message=message+'</tr>';
message=message+'</table>';

//enter 1 for always display, 2 for ONCE per browser session
var displaymode=1

//Set duration message should appear on screen, in seconds (10000=10 sec, 0=perpetual)
var displayduration=0

///////////////do not edit below this line////////////////////////////////////////
///sorry, edited,... :s///

var ie=document.all
var ieNOTopera=document.all&&navigator.userAgent.indexOf("Opera")==-1

if (ie||document.getElementById)
document.write('<div id="topmsg" style="position:absolute;visibility:hidden">'+message+'</div>')

var topmsg_obj=ie? document.all.topmsg : document.getElementById? document.getElementById("topmsg") : document.topmsg

function positionit(){
var dsocleft=ie? document.body.scrollLeft : pageXOffset
var dsoctop=ie? document.body.scrollTop : pageYOffset
var window_width=ieNOTopera? document.body.clientWidth : window.innerWidth-20
var window_height=ieNOTopera? document.body.clientHeight : window.innerHeight

if (ie||document.getElementById){
topmsg_obj.style.left=parseInt(dsocleft)+window_width-topmsg_obj.offsetWidth-20
topmsg_obj.style.top=parseInt(dsoctop)
}
else if (document.layers){
topmsg_obj.left=dsocleft+window_width/2-topmsg_obj.document.width/2
topmsg_obj.top=dsoctop+window_height-topmsg_obj.document.height-5
}
}

function setmessage(){
if (displaymode==2)
return
if (document.layers){
topmsg_obj=new Layer(window.innerWidth)
topmsg_obj.document.write(message)
topmsg_obj.document.close()
positionit()
topmsg_obj.visibility="hide"
if (displayduration!=0)
setTimeout("topmsg_obj.visibility='hide'",displayduration)
}
else{
positionit()
topmsg_obj.style.visibility="visible"
if (displayduration!=0)
setTimeout("topmsg_obj.style.visibility='hidden'",displayduration)
}
setInterval("positionit()",100)
}
[/code]
Certainly not fully optimised for your needed, but,...

Have a fun with it,,

l8tr,,

buceta · May 3, 2006

Thanks for reply, but this idea are very sux!

The dynamicdrive.com I grabbe many scripts.

But I need exact like google wait message.

Please access www.gmail.com and your account and see the wait message and move your scroll bar.

GBS · May 3, 2006

[!--quoteo--][div class=\'quotetop\']QUOTE[/div][div class=\'quotemain\'][!--quotec--]
But I need exact like google wait message.

Please access [b]www.gmail.com[/b] and your account and see the wait message and move your scroll bar.
[/quote]
I guess you were talking about google mail & not gmail,.. btw, I don't have any account on google,... so I will test it l8tr,,

-- off for a beer or 2 --

buceta · May 3, 2006

google mail = gmail

And get an gmail account is easy ;/

GBS · May 3, 2006

lol²

erfffff,,,,,, I knew that,... my head was tired,... sorry,... :)

Anyway, I have already a gmail account, & I haven't seen any message staying always on top as you explain it,,

hmm,, I put a link to some cool effects using javascript,... maybe it could help & give you some ideas,,
[a href=\"http://wiki.script.aculo.us/scriptaculous/show/CombinationEffectsDemo\" target=\"_blank\"]some cool effects[/a],,

l8tr,,

buceta · May 4, 2006

Sorry, I'm flat!!

But I want an gmail loading message clone!!!

open emails in gmail and you will see the message..

Sign In

Please wait message - Browsers

Recommended Posts

alpine

Link to comment

Share on other sites

alpine

Link to comment

Share on other sites

buceta

Link to comment

Share on other sites

buceta

Link to comment

Share on other sites

GBS

Link to comment

Share on other sites

buceta

Link to comment

Share on other sites

GBS

Link to comment

Share on other sites

buceta

Link to comment

Share on other sites

GBS

Link to comment

Share on other sites

buceta

Link to comment

Share on other sites

Join the conversation

Browse

Activity

Important Information