PDA

View Full Version : How to play slideshow gallery in an iframe after preloader finished loading?



spookymix
11-22-2010, 05:09 PM
Here’s a link to my site:

site (http://www.calico9.com/site/)

How would I about start the slideshow after the preloader finished loading? The slideshow sometimes seem to start before the preloader is finished.

Please any help would be much appreciated. Thanks

Mike

spookymix
11-22-2010, 05:56 PM
I also forgot to mention…the background image also sometimes loads after the preloader finished loading. I want to preloader to load all the context on the page…the iframe slideshow included.

I’m using the Jquery Preloader by Gaya design. Here’s a link
Preloader by Gaya design (http://www.gayadesign.com/diy/queryloader-preload-your-website-in-style/)

Thanks

Mike

jscheuer1
11-23-2010, 10:58 AM
On the calico9.com/site/ page:


You probably need (unless the body is the default, which it appears to be) a selector here (addition highlighted):



</div>




<script type='text/javascript'>
QueryLoader.selectorPreload = "body";
QueryLoader.init();
</script>


</body>


</html>

Either way, that will only take in the images in img tags in the body of that page. Any that are not should be able to be added in a visibility hidden, positioned absolute division as the first thing after the opening <body> tag:


. . . Element, {duration: duration, from: from, to: to, toggle: toggle});
}
</script>

</head>

<body>
<div style="visibility: hidden; position: absolute; top: -10000px; left: -10000px;">
<img src="Images/bg.gif" alt="Background Image" />
<img src="Images/slideshow/image2.jpg" alt="Slideshow Image 2" />
<img src="Images/slideshow/image3.jpg" alt="Slideshow Image 3" />
<img src="Images/slideshow/image4.jpg" alt="Slideshow Image 4" />
<img src="Images/slideshow/image5.jpg" alt="Slideshow Image 5" />
<img src="Images/slideshow/image6.jpg" alt="Slideshow Image 6" />
<img src="Images/slideshow/image7.jpg" alt="Slideshow Image 7" />
</div>
<div id="page_effect" style="display . . .


I haven't tested any of this so it may be a little bit of overkill and/or require tweaking. But from my read of the situation and of the documentation/examples for QueryLoader, it should do the trick.

spookymix
11-23-2010, 05:11 PM
Thanks allot John!

Your solution seems to do the trick.

Mike

jscheuer1
11-23-2010, 09:27 PM
Great! Looks like I left out:

Images/slideshow/image1.jpg

You can add it to that prefix division if you like, but it doesn't appear to be required. Some browsers and/or on slower connections might require it though. That is to maintain the effect you're going for.