Форумы портала PHP.SU » Клиентская разработка » JavaScript & VBScript » Остановить выполнение скрипта

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

1. kuller - 22 Апреля, 2017 - 16:38:01 - перейти к сообщению
Подскажите можно ли остановить выполнение вот этого кода по клику на кнопку.

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.  
2. OrmaJever - 22 Апреля, 2017 - 16:57:59 - перейти к сообщению
конечно можно
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. kuller - 22 Апреля, 2017 - 17:09:18 - перейти к сообщению
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 отключить эти стили... знаю как изменить класс, но как быть с этим вариантом?
4. armancho7777777 - 22 Апреля, 2017 - 22:15:20 - перейти к сообщению
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. }
?

 

Powered by ExBB FM 1.0 RC1