| |
|
|
| | Здравствуйте,
Сложилась следующая проблемка, в поиске, увы, решения найти не смог.
Описываю:
1. Есть собственная функция, которая поднимает элемент на 45 пикселей вверх:
// Функция сворачивания тулбара сайта.
var i = 1;
function turn_toolbar()
{
document.getElementById("toolbar").style.marginTop = '-'+i+'px';
if(i == 45)
{
document.getElementById("turn").style.display = 'none';
document.getElementById("restore").style.display = 'block';
i = 1;
return;
}
i++;
setTimeout("turn_toolbar()", 20);
}
|
Она срабатывает при нажатии на определённую кнопку. Работает как надо.
2. Есть вторая собственная функция, опускающая элемент на 45 пикселей вниз:
// Функция восстановления тулбара сайта.
var n = 0;
function restore_toolbar()
{
document.getElementById("toolbar").style.marginTop = n+'px';
if(n == 45)
{
document.getElementById("restore").style.display = 'none';
document.getElementById("turn").style.display = 'block';
n = 1;
return;
}
n++;
setTimeout("restore_toolbar()", 20);
}
|
Вот с ней и начинается проблема. Работает как необходимо за исключением того, что элемент, который необходимо передвинуть перед срабатыванием функции элемент автоматически появляется на том месте, на котором был до работы первой функции. И уже после этого начинает движение "вниз" на 45 пикселей.
Пытался решить проблемы путём задания
document.getElementById("toolbar").style.marginTop = '-45px';
|
перед работы функции 2, но результат прежний.
Очень надеюсь, что поможете скорректировать вторую функцию или подскажите другой вариант, как можно реализовать эффект "сворачивания"-"восстановления" элемента (как Вы наверное поняли, в моём случае элемент сначала "уезжает" за пределы окна браузера, а потом, при нажатии пользователем на кнопке восстановления "возвращается" на место).
С Уважением, Дмитрий. | |
| |
|
|
| |
|
|
| |
для: Desh
(18.07.2009 в 13:26)
| | | Все корректно работает согласно тем условиям, которые вы сами задаете. | |
| |
|
|
| |
|
|
| |
для: sim5
(18.07.2009 в 14:04)
| | | Тут появилась небольшая ясность: всё дело в значении стиля body {margin: 0px; } Если меняю его на -45px, к примеру, то и "выезд вниз" начинается как необходимо (однако в таком случае первоначально не видно самого блока).
Попытался сделать так, что после выполнения первой функции для margin-top для body становится -45px, но не срабатывает.
В итоге пока ещё ищу варианты корректировки) | |
| |
|
|
| |
|
|
| |
для: Desh
(18.07.2009 в 13:26)
| | | Измените одну строчку на:
function turn_toolbar ()
{
document.getElementById ('toolbar').style.marginTop = (45 - i) + 'px';
|
Ну и, полагаю, что кнопка, клик по которой вызывает функцию turn_toolbar (),
изначально имеет у вас стиль display: none; | |
| |
|
|
| |
|
|
| |
для: PAT
(18.07.2009 в 15:19)
| | | Заменил чуточку другое, во второй функции поставил:
document.getElementById("toolbar").style.marginTop = (-45 + n) + 'px';
|
и всё стало работать как надо.
Спасибо за идею, она помогла добиться нужного результата)
sim5, тоже большое спасибо за участие) | |
| |
|
|
| |
|
|
| |
для: Desh
(18.07.2009 в 15:49)
| | | Здравствуйте!)
Ещё одна проблема в этом же скрипте, только тут что-то совсем не понятное для меня.
Во всех браузерах всё работает очень хорошо, как необходимо, кроме IE 6 и IE 7. Проблема заключается в следующем: сразу после окончания выполнения функции (к примеру 1) все стилевые данные, которые функция изменяла обнуляются. Т.е., к примеру, согласно функции 1 (см. первое сообщение) элемент был поднят на 45 пикселей вверх, во всех браузерах он был поднят и всё, там и остался, но в 6 и 7 осле после поднятия элемента на 45 пикселей вверх он моментально становится обратно на первоначальное положение.
Собственно вопрос: как можно заставить "запоминать" изменения в IE 6,7? С 8 версией всё в порядке.
Заранее большое спасибо!) | |
| |
|
|
