Html картинка

[Ghost3]

Здрасьте!
У меня такой вопрос: как сделать картинку в теге <img src="***"> так, шобы при нажатии X раз она менялась на другую картинку.
Помогите пожалуйста!
Ps: не судите мои знания строго. Я только изучаю Html.

[Cronos20]

Это вам уже javascript нужно изучать.
Максимум анимации от CSS и HTML(ниже 5 версии) можно получить используя псевдокласс :hover для элемента - т.е. при наведении курсора (но не клик!) на блок с фоновым изображением (ваша картинка) можно его изменить динамически.

[Ghost3]

Ну, тогда...
А можно javascript?

[Ghost3]

Я тут поискал немного, нашел в одной теме скрипт и немного переделал

<script language="JavaScript">
var state = false;

function change(s)
{
 if (s)
 {
 document.getElementById('image').src = "1.gif";
 }
 else
 {
 document.getElementById('image').src = "2.gif";
 }
 state = s;
}
</script>

<img src="1.gif" onclick="change(!state);" id="image" border="2"/>

Только мне не нравится то, что кликнуть достаточно 1 раз. Как сделать, чтоб кликать нужно было... раза 5?

[xDyPx]

Приблизительно так:

<script language="JavaScript">
var state = false;
var i=0; //создаем новую переменную, в которой будет храниться число кликов
function change(s)
{
 i++;//при клике увеличиваем значение этой переменной
 if(i==5)//если кликнули сколько раз нам нужно, то меняем картинку
 {
 if (s)
  {
   document.getElementById('image').src = "1.gif";
  }
  else
  {
   document.getElementById('image').src = "2.gif";
  }
  state = s;
 }
}
</script>

[Ghost3]

Спасибо, но... где-то ошибка вроде.

[Ghost3]

Нашел скрипт, он просто меняет при нажатии на следующую картинку, помогите пожалуйста разобраться школьнику:

function changeImage(imageId) {
    var allImages=new Array()
    allImages[0]="img/54.jpg" //и т. д., в массив записиваешь пути к картинкам
    var imageNumber=0
    var imageObj=document.getElementById(imageId)
    function changingImage() {
        imageNumber++
        if (imageNumber==allImages.length) {
            imageNumber=0
        }
        imageObj.src=allImages[imageNumber]
    }
    imageObj.onclick=changingImage
}

Никак не пойму, куда вписывать пути к картинкам.
Само собой ясно, что img/54.jpg надо заменить на свое... а дальше что?

[Wicort]

Написано же

allImages[0]="img/54.jpg"; //и т. д., в массив записиваешь пути к картинкам

соответственно продолжаете дальше

allImages[1]="img/55.jpg";
allImages[2]="img/56.jpg";
allImages[3]="img/57.jpg";

и так далее.
И не забывайте ставить точку с запятой.

[Ghost3]

Спасибо!
Только опять где-то че-то не то. Не работает.

<script language="JavaScript">
function changeImage(imageId) {
    var allImages=new Array()
        allImages[0]="diz/1.gif";
        allImages[1]="diz/2.gif";
        allImages[2]="diz/3.gif";
        allImages[3]="diz/4.gif";
        allImages[4]="diz/5.gif";
    var imageNumber=0
    var imageObj=document.getElementById(imageId)
    function changingImage() {
        imageNumber++
        if (imageNumber==allImages.length) {
            imageNumber=0
        }
        imageObj.src=allImages[imageNumber]
    }
    imageObj.onclick=changingImage
}
</script>

[Cronos20]

Может вы все-таки огласите какую ошибку выдает браузер, а заодно покажете как и где вы вызываете changeImage(imageId) .... потому что я думаю вы ее пытаетесь вызывать как в первых постах с другим параметром, а я бы вызывал как-то так:

<img src="1.gif" onclick="changeImage(this);" border="2"/>

И избавился бы в этом случае от лишнего
var imageObj=document.getElementById(im ageId).
Поэтому надо смотреть все целиком.
И еще что-то мне вложенные друг в друга функции не нравятся ...