E
e
IE6. I have a form that can take a while to process once the user submits
it. So upon submittal of the form, the onclick event for the submit button
changes some text on the screen to say 'please wait', and also displays a
little cycling-animated gif (just to encourage the notion that the webpage
is 'doing something'). The problem is that sometimes only the placeholder
for the image shows up, and sometimes the image shows up; it's more or less
a gamble each time whether or not the image will fully load. Here's what
I'm doing, in a nutshell:
When the page is initially loaded, I 'preload' the image by creating a new
image object in js:
var pleaseWait = new Image(100, 13);
pleaseWait.src = '/images/pleasewait.gif';
On the page, there is an img tag that has no src attribute and a
style.visibility of hidden. It's laying in wait for the submit button to be
clicked so it can display the image when it's time:
<img id=animImg width=0 height=0 style="visibility: hidden;" border=0>
And in the submit onclick handler, this happens:
animImg.src = pleaseWait.src;
animImg.style.visibility = 'visible';
animImg.width = pleaseWait.width;
animImg.height = pleaseWait.height;
Sometimes the image shows up, and sometimes it doesn't. I've swapped around
the order in which animImg's properties are modified, but to no avail. Is
there a way to do this so that the image reliably loads fully every time the
submit button is clicked? Any force-the-image-to-display methods, special
order I should be doing this in, etc?
it. So upon submittal of the form, the onclick event for the submit button
changes some text on the screen to say 'please wait', and also displays a
little cycling-animated gif (just to encourage the notion that the webpage
is 'doing something'). The problem is that sometimes only the placeholder
for the image shows up, and sometimes the image shows up; it's more or less
a gamble each time whether or not the image will fully load. Here's what
I'm doing, in a nutshell:
When the page is initially loaded, I 'preload' the image by creating a new
image object in js:
var pleaseWait = new Image(100, 13);
pleaseWait.src = '/images/pleasewait.gif';
On the page, there is an img tag that has no src attribute and a
style.visibility of hidden. It's laying in wait for the submit button to be
clicked so it can display the image when it's time:
<img id=animImg width=0 height=0 style="visibility: hidden;" border=0>
And in the submit onclick handler, this happens:
animImg.src = pleaseWait.src;
animImg.style.visibility = 'visible';
animImg.width = pleaseWait.width;
animImg.height = pleaseWait.height;
Sometimes the image shows up, and sometimes it doesn't. I've swapped around
the order in which animImg's properties are modified, but to no avail. Is
there a way to do this so that the image reliably loads fully every time the
submit button is clicked? Any force-the-image-to-display methods, special
order I should be doing this in, etc?