Using Random Picture javascript with Floatbox...

Page: 1

Author Post
avtdeadhead
Guest
Hi,
First off... FLOATBOX is GREAT! Thanks for the wonderful design and features!

I have a question about using Floatbox with a javascript to display a random image on a webpage... the javascripts I've come accross usually have a link to a html page and I was wondering if it could be used and trigger floatbox from the random thumbnail?

I've been trying to get it to work, but I'm not that great writing javascript and wondered if you would know if it's possible to trigger floatbox from inside the following javascript and how I can go about it.

Thanks!

<script language="JavaScript"><!--

//store the quotations in arrays

images = new Array(4);

images[0] = "<a href = &#039;http://www.yourdomainhere.com/images/image1.jpg" class="floatbox"&#039;><img

src=&#039;http://www.yourdomainhere.com/images/image1t.jpg&#039; alt=&#039;Image 1&#039;></a>";

images[1] = "<a href = &#039;http://www.yourdomainhere.com/images/image2.jpg" class="floatbox"&#039;><img

src=&#039;http://www.yourdomainhere.com/images/image2t.jpg&#039; alt=&#039;Image 2&#039;></a>";

images[2] = "<a href = &#039;http://www.yourdomainhere.com/images/image3.jpg" class="floatbox"&#039;><img

src=&#039;http://www.yourdomainhere.com/images/image3t.jpg&#039; alt=&#039;Image 3&#039;></a>";

images[3] = "<a href = &#039;http://www.yourdomainhere.com/images/image4.jpg" class="floatbox"&#039;><img

src=&#039;http://www.yourdomainhere.com/images/image4t.jpg&#039; alt=&#039;Image 4&#039;></a>";

index = Math.floor(Math.random() * images.length);

document.write(images[index]);

//done

// --></script><br>
Administrator
Registered: Aug 2008
Posts: 3382
I'm not sure when you are trying to insert that anchor into the page. If you are doing it inline within the body tag, it should work out (if the javascript was correct - more on that later). If you are inserting an anchor after the page has loaded, you will need to run fb.tagAnchors against the new content to light it up. See the API reference for details.

An alternate way to go is to not give the new anchor a class of "floatbox", but instead give it an onclick action of onclick="fb.start(this); return false;". Again, described in the API reference.

But nothing is going to happen with the js code you quoted other than fatal errors being thrown. You're going to have to be more careful about what kind of quotes you are using, where the quoted strings terminate, and where the end of the statements are.

In general, you'll need something like:
images[0] = '<a href="http://www.yourdomainhere.com/images/image1.jpg" class="floatbox"><img src="http://www.yourdomainhere.com/images/image1t.jpg" alt="Image 1" /></a>';

Page: 1