Slideshow with texts

[SilverJack]

Hi everybody,

I'm using a slideshow script. It works well, but now I need that every image (when clicked) shows a text on another div. Here's the code:


<!-- I just created three arrays -->
var slide1 = new Array("slideshow/img1.jpg","slideshow/img2.jpg","slideshow/img3.jpg");
var slide2 = new Array("slideshow/img4.jpg","slideshow/img5.jpg","slideshow/img6.jpg");
var slide3 = new Array("slideshow/img7.jpg","slideshow/img8.jpg","slideshow/img9.jpg");

<!-- this is the slideshow script -->
var i = 0;
var j = 0;
var k = 0;
function Backward()
{
if (i == 0 && j == 0 && k == 0)
{
i = slide1.length - 1;
j = slide2.length - 1;
k = slide3.length - 1;
}
else
{
i--;
j--;
k--;
}
document.sld1.src = slide1;
document.sld2.src = slide2[j];
document.sld3.src = slide3[k];
}


function Forward()
{
if (i < slide1.length - 1 && j < slide2.length - 1 && k < slide3.length - 1)
{
i++;
j++;
k++;
}
else
{
i=0;
j=0;
k=0;
}
document.sld1.src = slide1;
document.sld2.src = slide2[j];
document.sld3.src = slide3[k];

}

Now, I created three new arrays with some texts:

var TxtArr1 = new Array ('First Text','Second Text','Third Text');
var TxtArr2 = new Array ('Fourth Text','Fifth Text', 'Sixth Text');
var TxtArr3 = new Array ('Seventh Text','Eight text','Ninth Text');

And then I tried with this function:

function ImgToTxt(id)
{
var obj = document.getElementById(id);
for (i=0; i <= slide1.length; i++)
{
for (j=0; j <= TxtArr1.length; j++)
{
if (slide1 == TxtArr1[j])
{
var divtext = obj.createTextNode(""+TxtArr1[j]);
obj.appendChild(divtext);
}
}
}
}

But it's wrong. Any idea of how could I change it to make it work? Any help would be appreciated.

Thank You.

SilverJack

 

[SilverJack]

Please Help!

 

[vacunita]

What is wrong? Do you get any errors? If so what are they?

Perhaps try using the innerHTML property of the DIV instead of appending textnodes.

obj.innerHTML=TxtArr[j];





----------------------------------
Phil AKA Vacunita
----------------------------------
Ignorance is not necessarily Bliss, case in point:
Unknown has caused an Unknown Error on Unknown and must be shutdown to prevent damage to Unknown.

Behind the Web, Tips and Tricks for Web Development.

http://behindtheweb.blogspot.com/

 

[SilverJack]

Hi vacunita, Thank You for your help.

I tried using the innerHTML property as you told me, but I get the same error as before. The IE debugger shows me this message:

"Object doesn't support this property or method"

The error is in 'var divtext obj.createTextNode(""+TxtArr1[j]);'

Even with Firefox the script doesn't work, so I don't think it could be an IE settings problem.

 

[vacunita]

Assuming obj is a valid reference to a div this should work:

 if (slide1[i] == TxtArr1[j])
            {
            obj.innerHTML="TxtArr1[j]";
            }

If you still get the error, then your var obj = document.getElementById([red]id[/red]); is pointing to some element that doesn't have an innerHTML property which Divs do.

Make sure your [red]id[/red] value is correct.

----------------------------------
Phil AKA Vacunita
----------------------------------
Ignorance is not necessarily Bliss, case in point:
Unknown has caused an Unknown Error on Unknown and must be shutdown to prevent damage to Unknown.

Behind the Web, Tips and Tricks for Web Development.

http://behindtheweb.blogspot.com/