Velocity Reviews - Computer Hardware Reviews

Velocity Reviews > Newsgroups > Programming > HTML > Image style (and thanks)

Reply
Thread Tools

Image style (and thanks)

 
 
Michael Satterwhite
Guest
Posts: n/a
 
      02-23-2005
First I want to thank those who answered my previous question).

I have an image that I'm going to use javascript to fade in. Unfortunately,
in IE I see the image blink as it's being loaded, then go to the fade-in.
What can I do to prevent the image from displaying at all until the form is
loaded - at which point I'll fade it in.

tia
---Michael

 
Reply With Quote
 
 
 
 
Noozer
Guest
Posts: n/a
 
      02-23-2005

"Michael Satterwhite" <satterwh.X$NO$S$(E-Mail Removed)> wrote in message
news:Ua1Td.37105$(E-Mail Removed)...
> First I want to thank those who answered my previous question).
>
> I have an image that I'm going to use javascript to fade in.

Unfortunately,
> in IE I see the image blink as it's being loaded, then go to the fade-in.
> What can I do to prevent the image from displaying at all until the form

is
> loaded - at which point I'll fade it in.


Set the default "display" style to "none" so the image won't be visible when
the page loads?

Got a link?


 
Reply With Quote
 
 
 
 
Steve Pugh
Guest
Posts: n/a
 
      02-23-2005
"Noozer" <(E-Mail Removed)> wrote:
>"Michael Satterwhite" <satterwh.X$NO$S$(E-Mail Removed)> wrote in message
>news:Ua1Td.37105$(E-Mail Removed)...
>> First I want to thank those who answered my previous question).
>>
>> I have an image that I'm going to use javascript to fade in.

>Unfortunately,
>> in IE I see the image blink as it's being loaded, then go to the fade-in.
>> What can I do to prevent the image from displaying at all until the form

>is
>> loaded - at which point I'll fade it in.

>
>Set the default "display" style to "none" so the image won't be visible when
>the page loads?


visibility: hidden; would be better as it reserves the space for the
element, so the pag won't need to reflow when the fade in starts.

Also, don't do this in the main stylesheet. Do it via a style that's
created by JavaScript (I'm assuming that the fade effect is JS
powered) so that users without JS don't miss out on the image
altogether.

So in the <head> of the page include a script that's executed
immediately:
if (check for methods used during the fade effect, can't check for all
objects yet as the page hasn't finished loading) {
document.write('<style type="text/css">.foo
{visibility:hidden;}</style>');
}

and then the image <img class="foo"> will be initially hidden. Later
an onLoad event can change the visibilty and launch the fade in.

Steve

--
"My theories appal you, my heresies outrage you,
I never answer letters and you don't like my tie." - The Doctor

Steve Pugh <(E-Mail Removed)> <http://steve.pugh.net/>
 
Reply With Quote
 
 
 
Reply

Thread Tools

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off
Trackbacks are On
Pingbacks are On
Refbacks are Off


Similar Threads
Thread Thread Starter Forum Replies Last Post
DataGrid header style inconsistent with sortable column style cedoucette@alum.rpi.edu ASP .Net 0 10-14-2005 12:13 AM
All style tags after the first 30 style tags on an HTML page are not applied in Internet Explorer Rob Nicholson ASP .Net 3 05-28-2005 03:11 PM
Need help with Style conversion from Style object to Style key/value collection. Ken Varn ASP .Net Building Controls 0 04-26-2004 07:06 PM
Javascript Style Switcher that remebers current site style in use Hardeep Rakhra HTML 8 01-15-2004 08:00 PM
Style sheets, include one style within another (not inheritance) foldface@yahoo.co.uk HTML 1 11-24-2003 01:37 PM



Advertisments