Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 30.07.2017, 23:53
Новичок на форуме
Отправить личное сообщение для nklf-367 Посмотреть профиль Найти все сообщения от nklf-367
 
Регистрация: 12.06.2016
Сообщений: 7

clearInterval и приключения области видимости
Привет!

Есть у меня такой рабочий код, который, при клике на элемент меню сдвигает весь список влево\вправо так, чтобы "кликнутый" элемент оказался по центру блока.

var b=0;
var a=document.getElementsByClassName('slide');
var ul=document.getElementsByClassName('dd');
var z=document.getElementsByClassName('wrapper');
var halfBlock = (960/2) ;
var coord;
var ppx;
var computedStyle;
var currentLeft;


for(var i=0 ;i<a.length; i++) {
    b = a[i].offsetWidth + b;
}
ul[0].style.width = b + "px";

for(var i=0; i<a.length; i++) {
    (function() {
	var j = i;
	a[i].onclick = function() {
	    coord = a[j].getBoundingClientRect();
            if(coord.left < halfBlock) {
		var  timerLeft = setInterval( function(){
		    coord = a[j].getBoundingClientRect();
		    ul[0].style.left = 4 + ppx + "px";
		    computedStyle = getComputedStyle(ul[0]);
		    currentLeft = computedStyle.left;
		    ppx = Number(currentLeft.slice(0, currentLeft.indexOf("px")));
		    if(coord.left >= halfBlock - coord.width / 2 ) {
			
			clearInterval(timerLeft);
			
		    }
		},4)
	    } else {
		var  timerRight = setInterval( function(){
		    coord = a[j].getBoundingClientRect();
		    ul[0].style.left = -4 + ppx + "px";
		    computedStyle = getComputedStyle(ul[0]);
		    currentLeft = computedStyle.left;
		    ppx = Number(currentLeft.slice(0, currentLeft.indexOf("px")));
		    if(coord.left <= halfBlock - coord.width / 2 ) {
			
			clearInterval(timerRight);
		    }
		},4)
		
	    }
	}
    })();
    
    
}


Но если сделать ветвление иначе:
if(coord.left < halftBlock) {
    setInterval(timerLeft)
} else {
   setInterval(timerRight)
}
function timerLeft() {
        //...my code
    }
function timerRight() {
        //...my code
    }

То функции выполняются, но не срабатывает clearInterval. Блок уезжает в бесконечные дали за экраном. Вероятно, clearInterval не получает доступа к функции, которую он должен тормозить.
Ответить с цитированием
  #2 (permalink)  
Старый 31.07.2017, 01:48
Аватар для j0hnik
Профессор
Отправить личное сообщение для j0hnik Посмотреть профиль Найти все сообщения от j0hnik
 
Регистрация: 01.12.2016
Сообщений: 3,650

if(coord.left < halftBlock) {
    var l = setInterval(timerLeft);
} else {
   var r = setInterval(timerRight);
}
function timerLeft() {
//...my code
        clearInterval(l);
    }
function timerRight() {
//...my code
         clearInterval(r);
    }
Ответить с цитированием
Ответ



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

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


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
getJSON и области видимости SteelRat Javascript под браузер 1 13.11.2015 06:09
Доступ к главной области видимости Penetrator Angular.js 1 21.01.2015 23:13
Событие JS, объект выходит из области видимости браузера Z@R@ Events/DOM/Window 1 28.01.2013 07:02
Как узнать находится ли DOM элемент в области видимости? phgrey Общие вопросы Javascript 4 22.03.2011 19:05
области видимости элементов zaytsewa jQuery 14 11.01.2011 16:49