плавное появление или изменение прозрачности - Форум » uCoz » Другие скрипты для uCoz » Жизнь Гигабайта

Страница 1 из 1
1

плавное появление или изменение прозрачности

Дмитрий

Дата: Понедельник, 11.06.2012, 18:40 | Сообщение # 1 | Сообщить о нерабочей теме

Регистрация:	03.12.2011
Страна:	Российская Федерация
Репутация:	14
Сообщений:	1421
Награды:	4 +
Статус:

плавное появление или изменение прозрачности
Для определения прозрачности в css по логике должно служить свойство opacity (Mozilla, Opera), но разработчики IE как всегда выделились и сделали по другому. К тому же в IE не все объекты можно сделать прозрачными. Ниже приведен пример с контейнером span, который в IE6 прозрачности не получает. Исследовать поведение других тегов в разных версиях "любимого" обозревателя, если честно, нет никакого желания.

Для установления прозрачности объекта в таблице стилей нужно писать:

Code

opacity: 0.5;
filter: alpha(opacity=50);

Прозрачность нельзя указывать в процентах явно. Она измеряется: для IE - от 1 до 100, для других - от 0 до 1.

Следующий скрипт осуществляет плавное появление / исчезание (читай плавное изменение прозрачности) объекта:

Code

var t,t2,obj,op;
var cm;  // для отображения процентов

function appear(x)   // x - конечное значение прозрачности
{
  op = (obj.style.opacity)?parseFloat(obj.style.opacity):parseInt(obj.style.filter)/100;

  if(op < x) {
   clearTimeout(t2);
   op += 0.05;
   cm.innerHTML = Math.round(op*10)/10*100+'%'; // отображение процентов
   obj.style.opacity = op;
   obj.style.filter='alpha(opacity='+op*100+')';
   t=setTimeout('appear('+x+')',20);
  }
}

function disappear(x) {
  op = (obj.style.opacity)?parseFloat(obj.style.opacity):parseInt(obj.style.filter)/100;

  if(op > x) {
   clearTimeout(t);
   op -= 0.05;
   cm.innerHTML = Math.round(op*10)/10*100+'%'; // отображение процентов
   obj.style.opacity = op;
   obj.style.filter='alpha(opacity='+op*100+')';
   t2=setTimeout('disappear('+x+')',20);
  }
}

Используя данные функции можно задать эффект появления / затухания проивольному числу элементов на странице. Для этого нужно установить у требуемых объектов соответствующие обработчики событий. При вызове функций не забываем устанавливать переменную obj, которая указывает у какого объекта будет изменяться прозрачность:

Code

From Russia With Love!

плавное появление или изменение прозрачности

Страница 1 из 1
1

Логин:
Пароль: