PHP.SU

Программирование на PHP, MySQL и другие веб-технологии
PHP.SU Портал     На главную страницу форума Главная     Помощь Помощь     Поиск Поиск     Поиск Яндекс Поиск Яндекс     Вакансии  Пользователи Пользователи

Страниц (1): [1]

> Найдено сообщений: 1
king22 Отправлено: 27 Декабря, 2016 - 19:01:33 • Тема: нужно менять картинку в IMG при наведении мышки и задержке на нем.. • Форум: JavaScript & VBScript

Ответов: 5
Просмотров: 1474
Мне нужно то же самое. Имеется 15 картинок вида:

CODE (htmlphp):
скопировать код в буфер обмена
  1. site.com/image/22/thumbs/00000001.jpg
  2. site.com/image/22/thumbs/00000002.jpg
  3. site.com/image/22/thumbs/00000003.jpg
  4. site.com/image/22/thumbs/00000004.jpg
  5.          ...
  6. site.com/image/22/thumbs/00000015.jpg


Также надо, чтоб при наведении мышки было слайд шоу с интервалом 1 сек. Так в чём же дело, спросите вы? А дело в том, что в батниках я ещё понимаю, но не в html. Вот если бы кто объяснил мне куда, в какой файл, выше приведённые коды надо положить, или как эти коды в один файл положить, как назвать эти файлы? Спасибо.
(Добавление)
Пока получилось с 15 -ю картинками, как отобразить, если число картинок неопределенно, то есть, если очередной картинки нет на сервере, начиналось бы сначало с первого рисунка?

1.html
CODE (htmlphp):
скопировать код в буфер обмена
  1. <!doctype html>
  2. <html>
  3. <body>
  4. <script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
  5. <script src="script2.js"></script>
  6. <img width="259" alt="" src="http://videos/thumbs/00000001.jpg" data-gallery="http://videos/thumbs/0000000" data-thumb="1" class="video-thums">
  7. </body>
  8. </html>


script2.js
CODE (htmlphp):
скопировать код в буфер обмена
  1.       $(document).ready(function(){
  2.           $('img.video-thums')
  3.           .hover(function() {
  4.               var _this = this,
  5.               gallery = _this.getAttribute('data-gallery'),
  6.               counter = _this.getAttribute('data-thumb');
  7.               _this.timer = setInterval(function() {
  8.                   if(counter > 16) {
  9.                       counter = 1;
  10.                   }
  11.                   if(counter < 10) {
  12.                      _this.src=gallery+'0'+counter+'.jpg';
  13.                      _this.setAttribute('data-thumb',  counter);
  14.                      counter++;
  15.                  }
  16.                  if(counter > 9) {
  17.                       _this.src=gallery+counter+'.jpg';
  18.                       _this.setAttribute('data-thumb',  counter);
  19.                       counter++;
  20.                   }
  21.               }, 1000);
  22.           }, function() {
  23.               //this.src = this.getAttribute('data-src');
  24.               clearInterval(this.timer);
  25.           });
  26.       });

Страниц (1): [1]
Powered by PHP  Powered By MySQL  Powered by Nginx  Valid CSS  RSS

 
Powered by ExBB FM 1.0 RC1. InvisionExBB