Блог

Привет, кто-нибудь знает, как я мог бы добавить счетчик (т. Е. 1/12, 2/12, 3/12 и т.д.) В это слайд-шоу?

http://www.switchonthecode.com/tutorials/jquery-creating-a-slideshow

Кроме того, я хотел бы, чтобы у опции была другая кнопка, которая возвращает пользователя к первому изображению в любой заданный момент во время слайд-шоу.

Любая помощь по этому вопросу была бы очень признательна.

Спасибо!!

Для создания счетчика должно сработать следующее:

Новый HTML

 <div id="slideshow-area">
  <div id="slideshow-scroller">
    ... slideshow holder html (same as in the example) ...
  </div>
  <div id="slideshow-previous"></div>
  <div id="slideshow-next"></div>
  <div id="slideshow-counter"></div>
  <div id="slideshow-reset"></div>
</div>
  

Дополнительный CSS

 #slideshow-counter {
    width: 100%;
    height: 50px;
    position: absolute:
    left: 0;
    bottom: 0;
}
  

Дополнительный Javascript

 function updateCounter() {
    $('#slideshow-counter').html(currentSlide   "/"   totalSlides);
}

function showFirstSlide() {
    currentSlide = 1;
    updateContentHolder();
    updateButtons();
    updateCounter();
}
  

Затем добавьте updateCounter(); в новой строке после updateButtons() вызова в document.ready, showPreviousSlide и showNextSlide

Также в $(document).ready() функцию вам нужно будет добавить следующую строку: $("#slideshow-reset").click(showFirstSlide)