Форум программистов, компьютерный форум, киберфорум
JavaScript
Войти
Регистрация
Восстановить пароль
 
Рейтинг 5.00/5: Рейтинг темы: голосов - 5, средняя оценка - 5.00
3 / 3 / 1
Регистрация: 22.10.2013
Сообщений: 185
1

Как изменить JS скрипт, что бы кнопки на слайд шоу работали как "предыдущая" и "следующая"

19.05.2017, 21:11. Просмотров 1016. Ответов 1
Метки нет (Все метки)


Есть такой вот JS скриптик

Javascript
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
var imgs = ["foto_slide_show_1.jpg","foto_slide_show_2.jpg","foto_slide_show_3.jpg"];
var text = ['Картинка 1','<a href="index.php">Картинка 2</a>',
            '<font color="red">Картинка 3</font>','Картинка 4'];
var n=0;
time=800;
play=setInterval("chgImg(0)", 5000);
 
function chgImg(number) {
if (number!=0) n=number-2;
 $('#slide_show').fadeOut(time, function() {    //для картинок
  $(this).attr('src', imgs[n]).fadeIn(time);
 });
 
 $('#slide_text').fadeOut(time, function() {    //для текста
  $(this).html(text[n]).fadeIn(time);
 });
 
n++;
if (n>=imgs.length) n=0;
}
Так вот вывожу картинки

PHP
1
2
3
4
5
<div id = "foto_slide_show">
    <img src="foto_slide_show_1.jpg" alt="" id="slide_show">
    <img src="foto_slide_show_2.jpg" alt="" id="slide_show">
    <img src="foto_slide_show_3.jpg" alt="" id="slide_show">    
</div>
А так кнопки, которые работают при нажатии на определённый слайд. А мне нужно что бы гоняли слайд вперед назад. Подскажите, что можно сделать?

PHP
1
2
3
4
        <div id = "foto_slide_show_click">
            <div id = "foto_slide_show_prev" onclick="chgImg(4)"> <p><b> < </b></p> </div>
            <div id = "foto_slide_show_next" onclick="chgImg (2)"> <p><b> > </b></p> </div>
        </div>
0
Programming
Эксперт
94731 / 64177 / 26122
Регистрация: 12.04.2006
Сообщений: 116,782
19.05.2017, 21:11
Ответы с готовыми решениями:

Image как сделать "слайд шоу" или что-то подобное?
Доброго времени суток, Хочу сделать &quot;Слайд-шоу&quot; можно так сказать, чтоб картинки менялись,и через...

Как написать регулярное выражение для выдергивания английских букв и символов: "+", ",", ":", "-", " ", "!", "?" и "."
Не могу ни как собразить как написать регулярное выражение для выдергивания английских букв и...

Темы msstyles. Как можно сделать, чтобы кнопки "Закрыть", "Развернуть" и "Свернуть" отображались слева, а не справа?
Хочу создать свою тему (через theme и msstyles) для Windows, чтобы там кнопки системного меню были...

Как убрать кнопки "Minimize" и "Maximize", "Close" в заголовке окна?
КАК УБРАТЬ КНОПОЧКИ 'Minimize' и 'Maximize', 'Close' в заголовке окна (чтобы не было крестика в...

1
Юзер с абсолютным слухом
663 / 460 / 183
Регистрация: 17.12.2010
Сообщений: 1,345
20.05.2017, 10:55 2
Создайте переменную:
Javascript
1
var index = 1;
А код кнопок изменить так:
HTML5
1
2
3
4
<div id = "foto_slide_show_click">
            <div id = "foto_slide_show_prev" onclick="index--;chgImg(index)"> <p><b> < </b></p> </div>
            <div id = "foto_slide_show_next" onclick="index++;chgImg(index)"> <p><b> > </b></p> </div>
</div>
Но это незаконченное внедрение, когда картинки закончатся - выдаст ошибку. Решение будет зависеть от того, что будет требоваться - начать с начала или приостановить показ.
0
IT_Exp
Эксперт
87844 / 49110 / 22898
Регистрация: 17.06.2006
Сообщений: 92,604
20.05.2017, 10:55

Заказываю контрольные, курсовые, дипломные и любые другие студенческие работы здесь или здесь.

В зависимости от времени года "весна", "лето", "осень", "зима" определить погоду "тепло", "жарко", "холодно", "очень холодно"
В зависимости от времени года &quot;весна&quot;, &quot;лето&quot;, &quot;осень&quot;, &quot;зима&quot; определить погоду &quot;тепло&quot;,...

"Предыдущая запись" | "Следующая запись" по одной рубике
Добрый день! Наверно все знакомы со стандартной постраничной навигацией вордпресс. Когда наверху...

Как скрыть в graphABC кнопки "свернуть", "Развернуть", "Закрыть"
Как скрыть в graphABC кнопки &quot;свернуть&quot;, &quot;Развернуть&quot;, &quot;Закрыть&quot;

Получить значение из {"text1":"val1","text2":"val2","text3":{"text":"val"}}
Есть такая строка var my = '{&quot;text1&quot;:&quot;val1&quot;,&quot;text2&quot;:&quot;val2&quot;,&quot;text3&quot;:{&quot;text&quot;:&quot;val&quot;}}'; Как из...


Искать еще темы с ответами

Или воспользуйтесь поиском по форуму:
2
Ответ Создать тему
Опции темы

КиберФорум - форум программистов, компьютерный форум, программирование
Powered by vBulletin® Version 3.8.9
Copyright ©2000 - 2021, vBulletin Solutions, Inc.