изменение изображения и подпись

Question

Я пытаюсь разработать способ изменить текст, который идет вместе с изображением, которое изменяется с JavaScript ...

var x = 0; 
var images = new Array(".jpg", ".jpg", ".jpg", ".jpg", ".jpg"); 
var i = setInterval(auto, 10000); 

function auto() { 
    x++; 
    if (x == images.length) x = 0; 
    document.getElementById('bigImage').src = images[x]; 
} 

function changeImage(img, imagetitle) { 
    document.getElementById('bigImage').src = img; 
    /* document.getElementById('mainimagetitle').innerHtml = imagetitle; */ 
}​​​ 

Закомментированная часть, как я полагаю, я мог бы, возможно, измените текст, который идет с изображением. Как мне закодировать html. Должен ли я использовать a с id mainimagetitle? Если да, где и как я могу добавить разные тексты, которые я хочу показать и скрыть?

Answer 1

Как я вижу из вашей публикации, это должно выполнить эту работу.

<img id="bigImage" src="img1.jpg" alt="" /> 
<div id="mainimagetitle"></div> 

Обязательно добавьте (заполненный) тег src или вы получите странные результаты в IE. Когда вы начнете со второго изображения (x ++ перед изменением), это не будет проблемой. Счастливый случай, я думаю. ;-)

// Правка: Конечно, любой элемент будет действовать до тех пор, пока вы используете правильный идентификатор. Но вы не сказали нам, какой html вы используете (xhtml/html5/...).

Answer 2

Вы могли бы потенциально иметь другой массив, который хранит подписи для каждого из изображений

var captions = ['Caption 1', 'Caption 2', ...]; 

Предполагая mainimagetitle является идентификатор <p> элемента, вы можете сделать:

function changeImage(img, imagetitle) { 
    document.getElementById('bigImage').src = img; 
    document.getElementById('mainimagetitle').innerText = imagetitle; 
}​​​ 

Вы можете см. полный пример, основанный на вашем коде here.