rotipom
Posts: 8
Joined: Wed Nov 03, 2010 4:22 am

How do hide the flash of unstyled content during loading?

Here is my site : http://www.treespacestudio.com/home/
HELP-I am using the flickr + highslide plugin for thesis and everytime the gallery page loads, I see flashes of the unstyled content which is really ugly. I know there is a script that I should be able to use to remedy this. Has anyone fixed this before?

Thanks!!
Amy
User avatar
RoadRash
Posts: 8249
Joined: Tue Jul 15, 2008 6:43 pm
Location: Fredrikstad, Norway
Contact: Website

Re: How do hide the flash of unstyled content during loading?

Hi Amy,

What you see is the alternate text for the images. You can ÔÇ£hideÔÇØ it by setting the color for the text to the same color as the background.
Add color: #F0EDD1; to .highslide in your highslide.css file:

Code: Select all

.highslide {
	outline: none;
	text-decoration: none;
	[hilight]color: #F0EDD1;[/hilight]
}
Hilde
Highslide Support Team

Overview of my Highslide sample pages: RoadRash.no
rotipom
Posts: 8
Joined: Wed Nov 03, 2010 4:22 am

Re: How do hide the flash of unstyled content during loading?

Roadrash,
That works brilliantly, thanks so much!!! It also helps a bit when I upgraded to the latest highslide.js. It made it faster too.

EDIT: Please see post below.
Last edited by rotipom on Wed Nov 03, 2010 11:06 pm, edited 1 time in total.
rotipom
Posts: 8
Joined: Wed Nov 03, 2010 4:22 am

Re: How do hide the flash of unstyled content during loading?

Hi roadrash,
Expert advice needed. In my excitement over the alt text invisibility, I didn't realize that there are still little light colored borders that still appear during loading. I checked across browsers and it's there. Sometimes if the loading is fast, it doesn't appear, but often times they are there.

Is there something else I can fix in the css for it?

Thanks!
Amy
User avatar
RoadRash
Posts: 8249
Joined: Tue Jul 15, 2008 6:43 pm
Location: Fredrikstad, Norway
Contact: Website

Re: How do hide the flash of unstyled content during loading?

The borders that appear during loading are the thumbnails borders. They appear like that because the thumbnails sometimes load a bit slowly from Flickr.
You can remove the thumbnails borders in this part of the highslide.css file:

Code: Select all

.highslide img {
	border: 1px solid #dddddd;
	float: left;
	margin: 1px;
}
Hilde
Highslide Support Team

Overview of my Highslide sample pages: RoadRash.no

Return to “Highslide Editor”