Ultimate fade-in slideshow

Hi
Is there any way of setting alt text for images inserted using the slideshow?

Why do you want to do that?

http://www.dynamicdrive.com/forums/s...ead.php?t=9401
If you only have one slideshow, I suggest using my modification. I'll suggest it as a replacement for the UFIS just as soon as I get it object-oriented :)

I still want to know why.

Thanks Twey for the suggestion but I have three slideshows running.
Brothercake.com has several fade options with alt text, but they only activate onclick, and I'm no programmer. But perhaps they might hve something to add.
JScheuer thanks for your interest but with respect I'm surprised you're asking. As a disabled person myself, I know the importance of making content accessible. That's why I'd prefer to have alt text. But I guess I'll have to do without for the time being.
Thanks for your feedback.

You wouldn't be so surprised if you had seen many of the recent requests for alt attributes that were really requests for a tooltip. The sort of thing best handled with the title attribute unless one wanted to get real involved about it. I was merely trying to determine if you wanted alt content capability or a sort of mini text popup. Because IE treats the alt attribute as a title attribute in the image tag when no title attribute is present, many people get the two confused. I was trying to determine which you actually wanted.

That said, it would be relatively easy to add either of those capabilities to this or virtually any slideshow that is powered by a multidimensional array. Simply add another entry to each image's individual array (in this script like so, addition red):

Code:

---

fadeimages[0]=["photo1.jpg", "", "","this could be the alternate text"]

---

Then utilize it in the code (adding alternate content for this script, addition red):

Code:

---

fadeshow.prototype.populateslide=function(picobj, picindex){
var slideHTML=""
if (this.theimages[picindex][1]!="") //if associated link exists for image
slideHTML='<a href="'+this.theimages[picindex][1]+'" target="'+this.theimages[picindex][2]+'">'
slideHTML+='<img src="'+this.postimages[picindex].src+'" alt="'+this.theimages[picindex][3]+'" title="" border="'+this.imageborder+'px">'
if (this.theimages[picindex][1]!="") //if associated link exists for image
slideHTML+='</a>'
picobj.innerHTML=slideHTML
}

---

This of course would require any image not having an alternate attribute specified in its array entry to have an empty entry there in its place, just like images with no links or with no targets in the original.

Thanks for the explanation. I sometimes findtooltips annoying when it comes to images. They're OK if they're on buttons, but when they obscure my beautiful photos, I find them annoying!
I've modified the script as you suggested, and I seem to have done it OK as it still runs!
How thoroughly does this technique work with screen-readers etc? Mine is a physical disability, but I'd like to be sure I've covered those with visual problems.
What exactly does the amendment do?
Thanks

Quote:

---

What exactly does the amendment do?

---

Simply adds an alt attribute to the images. This is some text that should be conveyed to the user in the event that the user agent cannot display the image; this could be because the requested file doesn't exist, because the image is corrupted, or because the browser is incapable of rendering images: for example, if it is a text-based browser or a screen reader.

Quote:

---

How thoroughly does this technique work with screen-readers etc?

---

I'm not entirely sure how a screen-reader would handle the changing of the images. It may read out the alts again when they change, or it may only read them once when the page loads. If there is a way to make the former happen, I think the way this script does it is probably the most likely. You may wish to check the resulting page using Firefox' Fangs screen reader emulator. Not all screen readers will work in exactly the same way, but Fangs' output should be close enough.

Thanks Twey,

I do understand about alt images (which is why I was keen to have them included) I was more interested in how, technically, the script returns the output to the browser. But I welcome your assurance that this is probably the most effective way.

Thanks also for the link. I'll get the page online and try it out as soon as I can.

Quote:

---

I do understand about alt images (which is why I was keen to have them included)

---

I did wonder :)

Quote:

---

I was more interested in how, technically, the script returns the output to the browser.

---

The script works by editing the inner HTML of the containing element and adding HTML for an image tag to it. The modification merely adds an alt attribute to that tag.

Thanks Twey.

What you say there looks complicated at first, but then makes a lot of sense when you read it slowly!
Thanks for explaining!

If you have time, would you mind looking at my other post:

Quote:

---

Multiple fade-in slideshows

---

Thanks

Sorry, I don't know enough about DreamWeaver to help you there. I'd suggest coding the pages yourself.

I just got Fangs! and my link is to the home page, as an update is available.

Playing with it, if all you want is one alt for the slide show, that can be inserted without changing the array(s) of images:

Code:

---

fadeshow.prototype.populateslide=function(picobj, picindex){
var slideHTML=""
if (this.theimages[picindex][1]!="") //if associated link exists for image
slideHTML='<a href="'+this.theimages[picindex][1]+'" target="'+this.theimages[picindex][2]+'">'
slideHTML+='<img src="'+this.postimages[picindex].src+'" alt="Slideshow" title="" border="'+this.imageborder+'px">'
if (this.theimages[picindex][1]!="") //if associated link exists for image
slideHTML+='</a>'
picobj.innerHTML=slideHTML
}

---

But it does appear twice, once for the image loaded and once for the image ready to go at the time the reader is invoked. In other words, as this script always has two images coded to the innerHTML of the slideshow divisions, only those two images actually coded to the innerHTML at the time the reader is invoked will be read. This would also be the case for the individual alt attributes as outlined before.