Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 13.08.2016, 15:35
Новичок на форуме
Отправить личное сообщение для jojocague Посмотреть профиль Найти все сообщения от jojocague
 
Регистрация: 13.08.2016
Сообщений: 7

Bootstrap Карусель + jquery
Всем привет!
никак не могу решить одну проблему. Когда карусель меняет картинку на сайте, то 2 блока дива должны менять цвет.. Проблема в том, что когда картинки идут по новому циклу( второй раз), то цвет дивов не меняется больше, а остается ченым... как решить проблему?

var timer0 = setInterval(function firstimg() {
  if($('img[alt="pikachu"]').is(':visible')) {
    $('.menu, .header_topline').animate({ backgroundColor: 'red' }, 1000 )
    clearInterval(timer0)
}
}, 0);

var timer1 = setInterval(function secondimg() {
  if($('img[alt="pokemons"]').is(':visible')) {
    $('.menu, .header_topline').animate({ backgroundColor: 'blue' }, 1000 )
    clearInterval(timer1)
  }
  }, 0);

var timer2 = setInterval(function thirdimg() {
  if($('img[alt="baltau"]').is(':visible')) {
    $('.menu, .header_topline').animate({ backgroundColor: 'white' }, 1000 )
    clearInterval(timer2)
  }
  }, 0);

var timer3 = setInterval(function lastimg() {
  if($('img[alt="pokemons4"]').is(':visible')) {
    $('.menu, .header_topline').animate({ backgroundColor: 'black' }, 1000 )
    clearInterval(timer3)
  }
  }, 0);
Ответить с цитированием
  #2 (permalink)  
Старый 13.08.2016, 19:04
Новичок на форуме
Отправить личное сообщение для jojocague Посмотреть профиль Найти все сообщения от jojocague
 
Регистрация: 13.08.2016
Сообщений: 7

Так работает идеально, до тех пор пока не нажимаешь alt+tab, то есть переходишь в другую программу. После этого все сбивается и опять не работает.. видимо это из-за того,что сбивается время срабатывания..

var timer0 = setTimeout(function firstimg() {
  if($('img[alt="pikachu"]').is(':visible')) {
    $('.menu, .header_topline').animate({ backgroundColor: '#E8D658' }, 1000 )
    timer0 = setTimeout(firstimg, 20000);  
  }}, 200);

var timer1 = setTimeout(function secondimg() {
  if($('img[alt="pokemons"]').is(':visible')) {
    $('.menu, .header_topline').animate({ backgroundColor: '#ffffff' }, 1000 )
    timer1 = setTimeout(secondimg, 20000);   
  }}, 5200 );

var timer2 = setTimeout(function thirdimg() {
  if($('img[alt="baltau"]').is(':visible')) {
    $('.menu, .header_topline').animate({ backgroundColor: '#3675A1' }, 1000 )
  timer2 = setTimeout(thirdimg, 20000);
  }}, 10200);

var timer3 = setTimeout(function lastimg() {
  if($('img[alt="pokemons4"]').is(':visible')) {
    $('.menu, .header_topline').animate({ backgroundColor: '#CA1E46' }, 1000 )
    timer3 = setTimeout(lastimg, 20000);
  }}, 15200);
Ответить с цитированием
  #3 (permalink)  
Старый 13.08.2016, 20:29
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,124

Сообщение от jojocague
Когда карусель меняет картинку на сайте, то 2 блока дива должны менять цвет..
так в карусель и ставьте смену цвета и выкиньте все таймеры
Ответить с цитированием
  #4 (permalink)  
Старый 13.08.2016, 20:53
Новичок на форуме
Отправить личное сообщение для jojocague Посмотреть профиль Найти все сообщения от jojocague
 
Регистрация: 13.08.2016
Сообщений: 7

я бы с удовольствием это сделал бы, если бы понимал как это реализовать правильно..
Ответить с цитированием
  #5 (permalink)  
Старый 13.08.2016, 21:39
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,124

jojocague,
$(function() {
$('#myCarousel').on('slid.bs.carousel', function (e) {
var i = $('#myCarousel li.active').index("#myCarousel li");
$('.menu, .header_topline').stop().animate({ backgroundColor: ['#E8D658','#ffffff','#3675A1','#CA1E46'][i] }, 1000 )
})
});

Последний раз редактировалось рони, 13.08.2016 в 22:06.
Ответить с цитированием
  #6 (permalink)  
Старый 13.08.2016, 22:53
Новичок на форуме
Отправить личное сообщение для jojocague Посмотреть профиль Найти все сообщения от jojocague
 
Регистрация: 13.08.2016
Сообщений: 7

один только вопрос.. Как вы нашли это событие и поняли, что оно надо для триггера?

Последний раз редактировалось jojocague, 13.08.2016 в 22:58.
Ответить с цитированием
  #7 (permalink)  
Старый 13.08.2016, 23:05
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,124

jojocague,
http://bootstrap-3.ru/javascript.php
Цитата:
Карусель carousel.js

Примеры
Цитата:
slid.bs.carousel Это событие срабатывает, когда карусель завершит переход к слайду.
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Адаптивная верстка bootstrap, html5, css3 & jQuery WebPak Работа 0 30.07.2016 01:16
jquery ui autocomplete combobox в модальном окне bootstrap mastanggt jQuery 3 25.07.2014 09:45
Ищется frontend программист\верстальщик Twitter bootstrap + jQuery remote_jquery Работа 0 18.06.2013 12:17
Карусель на jquery BoB jQuery 0 28.11.2010 20:14
Карусель на jQuery. Подскажите zulu0 jQuery 2 15.06.2009 16:28