Описание: Не так давно я выкладывал скрипт ротатор изображения на JavaScript . Однако, там была автоматическая смена изображения - показ слайдов. А вот сегодняшний скрипт позволяет пользователю изменять изображения с помощью кнопок. В общем, скрипт называется " Ротатор изображения на JavaScript с кнопками ", смотрит...

Ротатор изображений на JavaScript с кнопками

Описание: Не так давно я выкладывал скрипт ротатор изображения на JavaScript. Однако, там была автоматическая смена изображения - показ слайдов. А вот сегодняшний скрипт позволяет пользователю изменять изображения с помощью кнопок. В общем, скрипт называется "Ротатор изображения на JavaScript с кнопками", смотрите на результат, и если понравится, то можете вставить к себе на сайт.

Результат:

Код JavaScript (вставлять между тегами <head> и </head>):

<script type="text/javascript">
  var array = new Array(
    "Foto1.jpg",
    "Foto2.jpg",
    "Foto3.jpeg"
  );//массив с путями к картинкам
  var i = 0;
  function left() {
    var image = document.getElementById("rotatorbutton");
    i--;
    if (i < 0) i = array.length - 1;
    image.src = array[i];
  }
  function right() {
    var image = document.getElementById("rotatorbutton");
    i++;
    if (i == array.length) i = 0;
    image.src = array[i];
  }
</script>

Код HTML (вставлять между тегами <body> и </body>):

<table>
  <tr>
    <td>
      <input type = 'button' name = 'left' value = '<' />
    </td>
    <td>
      <script type = 'text/javascript'>
        document.write("<img id = 'rotatorbutton' src = '" + array[0] + "' alt = 'Ротатор изображений с кнопками' width = '200' height = '200' />");
      </script>
    </td>
    <td>
      <input type = 'button' name = 'right' value = '>' />
    </td>
  </tr>
</table>