PHP.SU

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


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

> Без описания
kuller
Отправлено: 22 Апреля, 2017 - 16:38:01
Post Id



Частый посетитель


Покинул форум
Сообщений всего: 541
Дата рег-ции: Нояб. 2009  


Помог: 2 раз(а)




Подскажите можно ли остановить выполнение вот этого кода по клику на кнопку.

CODE (javascript):
скопировать код в буфер обмена
  1.  
  2. $(function()
  3. {
  4.         $('.slider_item').each(function()
  5.         {
  6.                 var el = $(this);
  7.                 el.css('background-image', 'url(' + el.attr('data-src') + ')');
  8.         });
  9. });
  10.  


html вот такой
CODE (html):
скопировать код в буфер обмена
  1.  
  2. <div data-src="/images/bg1.jpg" class="slider_item"></div>
  3. <div data-src="/images/bg2.jpg" class="slider_item"></div>
  4. <div data-src="/images/bg3.jpg" class="slider_item"></div>
  5.  

(Отредактировано автором: 22 Апреля, 2017 - 16:40:45)

 
 Top
OrmaJever
Отправлено: 22 Апреля, 2017 - 16:57:59
Post Id



Активный участник


Покинул форум
Сообщений всего: 7550
Дата рег-ции: Янв. 2010  
Откуда: Чернигов


Помог: 298 раз(а)




конечно можно
CODE (javascript):
скопировать код в буфер обмена
  1. var proccess = true
  2. $(function()
  3. {
  4.         $('.slider_item').each(function()
  5.         {
  6.                 if( !proccess ) return;
  7.                 var el = $(this);
  8.                 el.css('background-image', 'url(' + el.attr('data-src') + ')');
  9.         });
  10. });

CODE (htmlphp):
скопировать код в буфер обмена
  1.  
  2. <button onclick='proccess=false'>Stop</button>
  3. <div data-src="/images/bg1.jpg" class="slider_item"></div>
  4. <div data-src="/images/bg2.jpg" class="slider_item"></div>
  5. <div data-src="/images/bg3.jpg" class="slider_item"></div>


-----
Если вы хотя бы 3-4 раза не решите всё выкинуть и начать заново - вы явно что-то делаете не так.
 
 Top
kuller
Отправлено: 22 Апреля, 2017 - 17:09:18
Post Id



Частый посетитель


Покинул форум
Сообщений всего: 541
Дата рег-ции: Нояб. 2009  


Помог: 2 раз(а)




OrmaJever пишет:
конечно можно
CODE (javascript):
скопировать код в буфер обмена
  1. var proccess = true
  2. $(function()
  3. {
  4.         $('.slider_item').each(function()
  5.         {
  6.                 if( !proccess ) return;
  7.                 var el = $(this);
  8.                 el.css('background-image', 'url(' + el.attr('data-src') + ')');
  9.         });
  10. });

CODE (htmlphp):
скопировать код в буфер обмена
  1.  
  2. <button onclick='proccess=false'>Stop</button>
  3. <div data-src="/images/bg1.jpg" class="slider_item"></div>
  4. <div data-src="/images/bg2.jpg" class="slider_item"></div>
  5. <div data-src="/images/bg3.jpg" class="slider_item"></div>


не срабатывает почему та... и в консоле нет ошибок
(Добавление)
похоже понял в чем проблема... я пытаюсь остановить анимацию увеличения изображения, а сама анимация прописана в css

CODE (htmlphp):
скопировать код в буфер обмена
  1.  
  2. @keyframes imageAnimation
  3. {
  4.     0% {opacity: 0; -webkit-animation-timing-function: ease-in; animation-timing-function: ease-in;}
  5.         8% {opacity: 1; -webkit-transform: scale(1.05); transform: scale(1.05); -webkit-animation-timing-function: ease-out; animation-timing-function: ease-out;}
  6.         17% {opacity: 1; -webkit-transform: scale(1.1); transform: scale(1.1);}
  7.         25% {opacity: 0; -webkit-transform: scale(1.1); transform: scale(1.1);}
  8.         to {opacity: 0;}
  9. }
  10.  


собственно получается надо еще через js отключить эти стили... знаю как изменить класс, но как быть с этим вариантом?
 
 Top
armancho7777777 Супермодератор
Отправлено: 22 Апреля, 2017 - 22:15:20
Post Id



Активный участник


Покинул форум
Сообщений всего: 4634
Дата рег-ции: Февр. 2011  
Откуда: Иркутск, Россия


Помог: 212 раз(а)




CODE (css):
скопировать код в буфер обмена
  1. .paused{
  2.     -webkit-animation-play-state:paused;
  3.     -moz-animation-play-state:paused;
  4.     -o-animation-play-state:paused;
  5.     animation-play-state:paused;
  6. }
?


-----
Болтовня ничего не стоит. Покажите мне код.
-Linus Torvalds
 
 Top
Страниц (1): [1]
Сейчас эту тему просматривают: 1 (гостей: 1, зарегистрированных: 0)
« JavaScript & VBScript »


Все гости форума могут просматривать этот раздел.
Только зарегистрированные пользователи могут создавать новые темы в этом разделе.
Только зарегистрированные пользователи могут отвечать на сообщения в этом разделе.
 



Powered by PHP  Powered By MySQL  Powered by Nginx  Valid CSS  RSS

 
Powered by ExBB FM 1.0 RC1. InvisionExBB