Javascript-форум (https://javascript.ru/forum/)
-   Элементы интерфейса (https://javascript.ru/forum/dom-window/)
-   -   Переменная портит меню (https://javascript.ru/forum/dom-window/9932-peremennaya-portit-menyu.html)

Vulkan 11.06.2010 19:32

Переменная портит меню
 
Здравствуйте, написал простенькое меню, вот код:
JS:
var t,t2;
function show_menu(name)
{ 
    var objectm = document.getElementById(name+'-menu');
    var width = parseInt(objectm.style.width);
    var opacity = parseFloat(objectm.style.opacity);
	if(width <= 200) {
			clearTimeout(t2); 
                                  width += 2;
			objectm.style.width = width;
			if(opacity <= 0.9) {
			opacity += 0.01; 
                                  objectm.style.opacity = opacity;
			}
    t = setTimeout(arguments.callee,5);
			}
}


function hide_menu(name)
{ 
    var objectm = document.getElementById(name+'-menu');
    var width = parseInt(objectm.style.width);
    var opacity = parseFloat(objectm.style.opacity);
      if(width >= 0) {
	clearTimeout(t);
	width -= 2;
	objectm.style.width = width;
	  if(opacity >= 0) {
		opacity -= 0.01; 
                       objectm.style.opacity = opacity;
			}
    t2 = setTimeout(arguments.callee,5);
			}
}

HTML:
<div class="home" onmouseover="show_menu('main')" onmouseout="hide_menu('main')"></div>
<ul id="main-menu" onmouseover="show_menu('main')" onmouseout="hide_menu('main')" style="opacity:0; width: 0;" class="sub_helper_list">
<li>Главная</li>
</ul>

Проблема заключается в том что когда в том что когда в getElementById прописываешь id объекста полностью например 'main-menu' всё работает на ура, а как только прописываешь name+'-menu', работает но если когда работает норм то меню появляется по таймауту, то здесь когда наводишь мышью объект увеличивает на 2 пикселя ширину и 0.01 непрозрачность... То есть когда прописываешь id целиков всё идёт по таймауту, а когда с переменной то таймаут почеу-то не катит. Помогите пожалуйста, уже два часа не могу понять в чём дело...:blink:

Kolyaj 11.06.2010 20:30

Цитата:

Сообщение от Vulkan
t = setTimeout(arguments.callee,5);

Вот тут параметр name в функцию уже не передастся.

Vulkan 11.06.2010 20:34

хм.. Даже об этом не думал... а каким образом тогда можно передать?

Kolyaj 11.06.2010 20:37

Ну я обычно делаю что-то вроде этого
function showMenu(name, callback) {
    var el = document.getElementById(name);
    // Ещё всякая инициализация
    (function() {
        if (/* Ещё продолжаем анимацию? */) {
            // Двигаем объект
            setTimeout(arguments.callee, 10);
        } else {
            // Закончили упражнение
            callback();
        }
    })();
}

Vulkan 11.06.2010 20:46

Не совсем понятно, а что в выше описанном Вами примере представляет из себя функция callback()?

Kolyaj 11.06.2010 20:48

Функция вызываемая по окончании анимации
// Показываем меню
showMenu(name, function() {
    alert('Показали');
})

Vulkan 11.06.2010 20:55

Извиняюсь если торможу (уже 13 часов за компом), но зачем мне это, мне же нужно передать переменную name, если callback нужен, то распишите пожалуйста поподробнее...

Kolyaj 11.06.2010 20:59

Это я вам на будущее сразу :) Щас может не надо, но потом обязательно понадобится. Как правило в любую асинхронную функцию передаётся callback, вызываемый по окончании её работы.

Vulkan 11.06.2010 21:02

Цитата:

Сообщение от Kolyaj (Сообщение 59083)
Это я вам на будущее сразу :) Щас может не надо, но потом обязательно понадобится. Как правило в любую асинхронную функцию передаётся callback, вызываемый по окончании её работы.

:) Понятно, спасибо, но возвращаясь к главному - ну так вы не в курсе как передать переменную использую arguments?

Kolyaj 11.06.2010 21:26

Я вам написал, как лучше сделать.


Часовой пояс GMT +3, время: 05:55.