Yes, set it in your CSS file.

Thank you! I’m glad to hear it all worked out for you!

If anyone wants to have a look here’s the link to one of my galleries. Any feedback or suggestions would be much appreciated.

I just wish I had found JaS earlier. It would have saved me a lot of time and headaches.

Thanks very much for making this available Robert.

Cheers,

Andrew

I’m glad to hear that you like it!
That problem in IE is indeed weird, and it appears if you apply the filter CSS (the one used for fades) to the element containing the image text. Therefore, try and have the text in a separate element, and things should be fine.

I have no idea how regions work in Dreamweaver, but any programming language allows you to single out if an item is the last within a loop, so you can distinguish whether to omit the comma or not.

As described in how to make a fallback, dor search engines as well as accessibility, you naturally should have the HTML code generated in the web page to begin with, and then let the JaS functionality be added on top of that.

];

Maybe the moderator can clean up my original post and delete this one.

Andrew

Do you know if this will affect search engine ranking? Would they see the same thing I’m seeing in the source code or the actual generated code with all the right captions, alt tags, etc?

Thanks,

Andrew

Put this at the very top of your PHP page to connect to your database and edit to your needs:

mysql_connect("localhost", "mysql_user", "mysql_password") or
die("Could not connect: " . mysql_error());
mysql_select_db("mydb");

$result = mysql_query("SELECT image, caption, tags FROM mytable");
</code
Then put this in the head section after the jas.js file has been included and wrap it in the appropriate javascript tags:

JaS.images = [

<?php
$row_num = mysql_num_rows($result);
$count = 1; //the first record
while ($line1 = mysql_fetch_array($result, MYSQL_ASSOC)) {
echo "[\"".$line1['image'].”\”,\”".$line1['caption'].”\”,\”".$line1['tags'].”\”]”;
//print the comma unless it is the last record
if ($count
];

You also have to remove the original images section in the javascript file. I’ve just started testing this tonight, and it seems to be working fine. However, any suggestions or feedback would be much appreciated.

Cheers,

Andrew

Thanks very much,

Andrew

That’s really impossible to say, but if it works locally, and it finds the JavaScript file on the server, it sounds like it’s a matter of invalid paths to the images.

I used the script and in my local machine works perfectly, but as soon as I uploade it in the server, the images won’t show, I know the ‘jas.js’ it’s working because the page shows exactly the numer of pictures, but i get the ‘undifined’ for every picture, am I doing something wrong, or is it just that the script doesn’t finds the images route in the server.

Hope to hear from you soon¡

Alex

Thank you.
As it says at the beginning of this post:

Add this code to the end of the jas.js to make it happen:
addEvent(window, “load”, function(){ setTimeout(” JaS.startSlideshow()”, 1)}, false);
(The setTimeout is to avoid a content parsing bug in Internet Explorer)

In Firefox, the slideshow starts playing automatically after page loaded, but it doesn’t autoplay in IE6 with ‘error’ in js.

Is there a way to solve the problem?

Thanks a lot!! Cheers~

Sure, add another field in that array. You need to add another property to the JaS object, and then add a line like the one below, but with image caption. instead

Within the setImage method, you can see this code for image text, which can be duplicated for the image caption:

this.imageText = this.currentImages[this.imageIndex][1];

This is of course the base of what you need to do, there’s some minor additional coding to do.

In our gallery we will have a number of text fields as well as the caption (photographer, location etc). Is it possible to extend the JaS.images array to include these extra fields alongside the caption?

If so, do you have any pointers on doing this?

Many thanks!

Absolutely. I’m glad that you ask!
If you take a look at the Vanilla theme, for example:

First, make sure the links within <ul id="navigation-controls"> point to a URL where you have the logic to show the next/previous image. Naturally, hide the links for starting and stopping slideshow since it won’t be supported.

For the same reason, hide <ul id="dim-background-controls">.

A good way to do this can be to apply a class to those elements which hides or positions them off screen, and then have a JavaScript which adds another class that resets that, so they’re shown for script-enabled web browsers.

And, lastly, have server-side code to generate thumbnails within <div id="jas-thumbnails"></div> (the exact code that the script generates). If wcript is enabled, what’s generated on the server side will basiccally just be replaced by the script.

Good luck!

I realise I need to use server side scripting to create a page displaying the images and thumbnails, but then is it possible to apply this slideshow script to such a page (where the images aren’t rendered by javascript).

Lovely pictures! The error is that in the JavaScript file, you need to specify the id of the element which will show each image’s text; it’s the imageTextContainerId property in the JavaScript.

If you don’t want to use any text, it should work by setting the property useImageText to false in the JavaScript file. If that doesn’t work, just comment out this line in the script:

this.imageTextContainer.setAttribute("alt", this.imageText);