Javascript.RU

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

Как заставить mouseenter приостанавливать цикл
Пытаюсь реализовать следующее: при запуске странички должны поочерёдно автоматически нажиматься кнопки (шесть штук button) на слайдере. Если посетитель заводит курсор над зоной слайдера (#screen), то цикл автоматического нажатия должен приостановиться. А когда курсор уходит с зоны слайдера, то цикл снова возобновляется (либо заново начинается).
Сейчас в коде ниже происходит так: при нажатии на кнопку пользователем раздел слайдера не успевает открыться и происходит срабатывание автоматического цикла. Как исправить? В каком направлении копать? Помогите пожалуйста.
Вот код:
var aaa =   setTimeout(function myd() {
  document.getElementById('justbutton').click()
 },10000);
 var bbb = setTimeout(function myd() {
  document.getElementById('justbutton2').click()
 },25000);
 var ccc = setTimeout(function myd() {
  document.getElementById('justbutton3').click()
 },40000);
 var ddd =  setTimeout(function myd() {
  document.getElementById('justbutton4').click()
 },55000);
 var eee =  setTimeout(function myd() {
  document.getElementById('justbutton5').click()
 },70000);
 var fff = setTimeout(function myd() {
  document.getElementById('justbutton6').click()
 },85000);
 
 $('#screen').on('mouseenter', function(){
 clearTimeout(aaa);
 clearTimeout(bbb);
 clearTimeout(ccc);
 clearTimeout(ddd);
 clearTimeout(eee);
 clearTimeout(fff);
});
 
 
$('#screen').on('mouseleave', function(){
 var aaa =   setTimeout(function myd() {
  document.getElementById('justbutton').click()
 },10000);
 var bbb = setTimeout(function myd() {
  document.getElementById('justbutton2').click()
 },25000);
 var ccc = setTimeout(function myd() {
  document.getElementById('justbutton3').click()
 },40000);
 var ddd =  setTimeout(function myd() {
  document.getElementById('justbutton4').click()
 },55000);
 var eee =  setTimeout(function myd() {
  document.getElementById('justbutton5').click()
 },70000);
 var fff = setTimeout(function myd() {
  document.getElementById('justbutton6').click()
 },85000);
});
 
 
 $('#screen .menu button').on('click', function(){
 clearTimeout(aaa);
 clearTimeout(bbb);
 clearTimeout(ccc);
 clearTimeout(ddd);
 clearTimeout(eee);
 clearTimeout(fff);
});
Ответить с цитированием
  #2 (permalink)  
Старый 02.10.2017, 14:25
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,123

Сообщение от Andreeshe
должны поочерёдно автоматически нажиматься кнопки
в нормальном слайдере есть режим avto и пауза на 'mouseenter'
Ответить с цитированием
  #3 (permalink)  
Старый 02.10.2017, 16:30
Новичок на форуме
Отправить личное сообщение для Andreeshe Посмотреть профиль Найти все сообщения от Andreeshe
 
Регистрация: 02.10.2017
Сообщений: 4

В данном слайдере такие режимы avto и пауза изначально не были предусмотрены. Слайдер разработан таким образом, чтобы именно при выборе самим Пользователем определенного раздела меню отображалась соответствующая информация. Для того, чтобы не нарушать работу слайдера в целом, мне в голову пришла идея сделать небольшую надстройку в виде организации названий разделов (куда и кликает Посетить) в кнопки (<button></button>) и написания скрипта для этих кнопок. Кнопки (они же разделы) теперь автоматически нажимаются, но clearTimeout почему-то не хочет останавливать этот цикл.
Ответить с цитированием
  #4 (permalink)  
Старый 02.10.2017, 16:49
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,123

Andreeshe,
уберите var в строках 30 - 49
Ответить с цитированием
  #5 (permalink)  
Старый 02.10.2017, 16:54
Новичок на форуме
Отправить личное сообщение для Andreeshe Посмотреть профиль Найти все сообщения от Andreeshe
 
Регистрация: 02.10.2017
Сообщений: 4

И сейчас при событии mouseenter (когда курсор над зоной слайдера-меню) происходит наоборот - возобновление автоматического цикла, хотя должна быть остановка с помощью clearTimeout, а возобновление только должно быть при mouseleave. Почему так?
Ответить с цитированием
  #6 (permalink)  
Старый 02.10.2017, 17:21
Новичок на форуме
Отправить личное сообщение для Andreeshe Посмотреть профиль Найти все сообщения от Andreeshe
 
Регистрация: 02.10.2017
Сообщений: 4

Сообщение от рони Посмотреть сообщение
Andreeshe,
уберите var в строках 30 - 49
Спасибо Вам большое, очень помогли. У меня изначально получилось, как я понимаю, что объявил новые переменные, а не использовал старые ))
Ответить с цитированием
Ответ



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

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


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Как заставить чтобы параметр обновлялся? Alexsher Общие вопросы Javascript 23 18.06.2014 22:05
Как определить на каком элементе произошло событие hover(или mouseenter)? Boshnik Оффтопик 10 24.03.2014 11:04
Как сделать цикл for столько сколько нужно(Самостоятельным) f0stgis Общие вопросы Javascript 3 25.02.2014 16:26
Как вы относитесь к наркоманам? Maxmaxmaximus7 Оффтопик 7 05.02.2014 13:29
Как обработать бесконечный цикл? Iktash Элементы интерфейса 3 16.11.2012 10:26