VPF::прозрачный div - Форум программистов

lasalexx

Дата 27.12.2006, 23:15 (ссылка)

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

Загрузка ...

Бывалый

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

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

можно ли сделать div с прозрачным фоном (opacity=40), но что б текст в div е оставался непрозрачным. Или для этого обязательно 2 div а накладывать друг на друга?

SamDark

Дата 28.12.2006, 10:01 (ссылка)

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

Загрузка ...

Добрый кот

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

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

lasalexx,
Можно. Знаю решение, если браузер держит PNG.

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

rmcreative.ru — Это жжж неспроста...
yiiframework.ru — О фреймворке Yii на русском.
reggi — здесь я регистрирую домены

lasalexx

Дата 28.12.2006, 17:58 (ссылка)

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

Загрузка ...

Бывалый

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

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

Цитата

Можно. Знаю решение, если браузер держит PNG.

Как? Если не секрет smile

SamDark

Дата 29.12.2006, 10:56 (ссылка)

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

Загрузка ...

Добрый кот

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

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

lasalexx,
Рисуем PNG нужного цвета с прозрачностью 40%. Далее используем CSS:

Код


#ourdiv{
   background: url(bg.png);
}

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

rmcreative.ru — Это жжж неспроста...
yiiframework.ru — О фреймворке Yii на русском.
reggi — здесь я регистрирую домены

Deja_Vu

Дата 17.6.2007, 00:12 (ссылка)

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

Загрузка ...

Шустрый

Профиль
Группа: Участник
Сообщений: 88
Регистрация: 15.6.2007
Где: Казань

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

Код


<style type="text/css">
#shade {position: absolute; top: 100px; left: 100px; filter: "alpha(Opacity=60, Style=0)"; background: gray; text-align: center; vertical-align: middle;  height: 3em; width: 10em; border: 1px solid}
#text {position: absolute; top: 100px; left: 100px; font-size: 1em; text-align: center; vertical-align: middle; height: 3em; width: 10em; border: 1px solid;}
</style>

<div id="shade">&nbsp;</div>
<div id="text">FILTER!</div>

Вот тебе решение. Правда позиционировать тяжело.

WebDisaster

Дата 22.6.2007, 19:56 (ссылка)

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

Загрузка ...

Опытный

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

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

Можно теперь и я встряну? =)

Вот это: filter: "alpha(Opacity=60, Style=0)"; - работает только в IE
Чтобы получить прозрачность в Мозилах добавляем плюс к этому: -moz-opacity: .6;
В Операх работать не будет ничего :(
Про Safari - чесна - не знаю smile

z-END

Дата 22.6.2007, 20:42 (ссылка)

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

Загрузка ...

прафесар™

Профиль
Группа: Комодератор
Сообщений: 3014
Регистрация: 13.3.2003
Где: Венья, Пиетари

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

Цитата(WebDisaster @ 22.6.2007, 20:56

)

В Операх работать не будет ничего :(

хто здесь?!

Код


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
<title>Вот тебе прозрачность</title>
<style>
img {
    _filter: alpha(opacity=50); 
    -moz-opacity: 0.5;  
    opacity: 0.5; 
}
img:hover {
    _filter: alpha(opacity=100); 
    -moz-opacity: 1;  
    opacity: 1; 
}
</style>
</head>
<body>
<img src="http://forum.vingrad.ru/style_images/2/menu/menu_forum.gif" alt="">
</body>
</html>

Работает в опере ИЕ, лисе

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

Каждый чилавек пасвоему праф...а памоему НЕТ!

WebDisaster

Дата 22.6.2007, 20:54 (ссылка)

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

Загрузка ...

Опытный

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

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

Ай! Дяденька, не бейте! Работать не будет ничего из написанного раньше. А такой простой вариант как-то даже не попадался =)

Это сообщение отредактировал(а) WebDisaster - 22.6.2007, 21:03

hAhol13

Дата 17.10.2011, 12:42 (ссылка)

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

Загрузка ...

Новичок

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

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

Тема старая, но чтоб не создавать новую.. Можно ли как-то перекрыть флэш прозрачным дивом? Непрозрачным - на ура, но как только изменяю состояние прозрачности хоть на 1%, флэш вылетает наверх.

Флэш подключен с wmode=opaque (с transparent точно так же). Прозрачный див содержит в себе менюшку. Прозрачность создавалась png-файлами и описанными выше через альфу.

SelenIT

Дата 17.10.2011, 20:35 (ссылка)

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

Загрузка ...

баг форума

Профиль
Группа: Завсегдатай
Сообщений: 3996
Регистрация: 17.10.2006
Где: Pale Blue Dot

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

А нафиг альфа-фильтр, когда png-фон уже полупрозрачен, а IE6 успешно вымер?

Добавлено через 4 минуты и 57 секунд
P.S. По сабжу современное решение задачи — rgba-заливка (с костылем для IE8- в виде той же старой доброй PNG-шки либо фильтра для градиентов). HTTP-запросы нужно экономить smile

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

Осторожно! Данный юзер и его посты содержат ДГМО! Противопоказано лицам с предрасположенностью к зонеризму!

hAhol13

Дата 18.10.2011, 04:21 (ссылка)

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

Загрузка ...

Новичок

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

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

Ок, спасибо за ссылку. Что-то до этого не добрался. Но начинаю понемногу приходить к мысли что перекрыть флэш-контент можно только непрозрачным дивом.

rgba-заливка тоже прячется под флэш, несмотря на вмод флэша.

SelenIT

Дата 18.10.2011, 11:21 (ссылка)

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

Загрузка ...

баг форума

Профиль
Группа: Завсегдатай
Сообщений: 3996
Регистрация: 17.10.2006
Где: Pale Blue Dot

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

Насколько помню, еще в 2005-м проблем с перекрытием флеша полностью прозрачной блочной ссылкой уже не наблюдал. Можно ссылку на проблемную страницу?

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

Осторожно! Данный юзер и его посты содержат ДГМО! Противопоказано лицам с предрасположенностью к зонеризму!

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