VPF::Визуальный эффект: плавное раскрытие div-а

BMC

Дата 3.8.2008, 20:46 (ссылка)

(нет голосов)

Загрузка ...

Новичок

Профиль
Группа: Участник
Сообщений: 27
Регистрация: 8.2.2007

Репутация: нет
Всего: нет

Добрый вечер! Необходимо создать вот такой графический эффект,как здесь при нажатии на фотографию http://www.altracing.ru/gallery/. Необходимо чтобы div из центра плано расплывался на весь экран. С помощью такой вот функции

Код


   function increase(min, max, step, itemId)
            {
                var item = document.getElementById(itemId);
                item.style.width = min+"%";
                item.style.height = min+"%";            
                if(min < max)
                    {
                        min+=step;
                        setTimeout("increase("+min+", "+max+", "+step+", \""+itemId+"\");", 10);
                    }
                document.getElementById("info").innerHTML = min+prefix;
            }

мы постепенно увеличиваем ширину и высоту,но в результате изображение появляется сверху и постепенно раскрывается влево,вправо и вниз,нам же необходимо его плавное всплывание во все стороны с центра равномерно,подобно как на том сайте.... Заранее спасибо за помощь smile

Ockonal

Дата 7.8.2008, 15:20 (ссылка)

(нет голосов)

Загрузка ...

Smile

Профиль
Группа: Участник
Сообщений: 219
Регистрация: 9.7.2007
Где: Ukraine::Nikolaev ;

Репутация: нет
Всего: 3

Смотри исходники сайта smile

Вот тебе функция, которая работая при клике:

Код


function dropdownmenu(obj,e,menucontents,menuwidth) {
    if(window.event)event.cancelBubble=true;
    else
    if( e.stopPropagation )
    e.stopPropagation();
    clearhidemenu();
    dropmenuobj=
    document.getElementById?document.getElementById("dropmenudiv"):dropmenudiv;populatemenu(menucontents);
    if(ie4||ns6){
        showhide(dropmenuobj.style,e,"visible","hidden",menuwidth);
        dropmenuobj.x=getposOffset(obj,"left");
        dropmenuobj.y=getposOffset(obj,"top");
        dropmenuobj.style.left=dropmenuobj.x-clearbrowseredge(obj,"rightedge")+"px";
        dropmenuobj.style.top=dropmenuobj.y-clearbrowseredge(obj,"bottomedge")+obj.offsetHeight+"px"
    }
return clickreturnvalue()
};

(с)http://www.altracing.ru
Может разберешься

--------------------

Ум заключается не только в знании, но и в умении прилагать знание на деле.Самое лучшее из всех доказательств есть опыт.Каждому человеку свойственно ошибаться, но никому, кроме глупца, несвойственно упорствовать в ошибке.

JSman

Дата 7.8.2008, 22:34 (ссылка)

(нет голосов)

Загрузка ...

Опытный

Профиль
Группа: Участник
Сообщений: 279
Регистрация: 10.7.2006

Репутация: нет
Всего: 4

Поведение браузеров при установке одиночного свойства обяъекта style отличается. Некоторые перерисовываются сразу при каждом изменении свойства, другие используют так называемые интервалы перерисовки отображения страницы. По моему мнению лучше задавать отображение элемента через style.cssText. Это гарантирует анимацию без скачков.

0 Пользователей читают эту тему (0 Гостей и 0 Скрытых Пользователей)
0 Пользователей:
« Предыдущая тема \| JavaScript: Общие вопросы \| Следующая тема »