Полупрозрачность
#1
P.S.: Если нет время читать пост, то вопрос находится внизу поста. Smile

В общем, в последнее время заинтересовался я этим очень красивым эффектом, который позволяет отдельные объекты делать полупрозрачными. Нарвался я на один какой-то сайт очень красивый, на космическую тему, вроде бы с PhpBB 2 и вот с этими полупрозрачными панелями. Тогда я и захотел использовать у себя такой же эффект. Где-то у меня была страница этого сайта. Ах да, это ж был Alpha-klan из вторых аллодов. Вот сайт: Alpha-klan.h12.ru. Ну, первым делом я значит полез копаться, как они это сделали. И, к сожалению, узнал, что на этом сайте этот красивый эффект был просто напросто сымитирован - были в нужные места подставлены картинки и усё. Sad Плюс, скин тоже оказался содранным с какого-то шаблона. Ну да ладно про него. Я решил на этом не останавливаться. После не таких уж и продолжительных поисков я нашёл пару статей, где говорится о том, как реализовать эту полупрозрачность в реале, а не имитацией. Несколько раз попытался сделать всё так, как там было описано, но никакого эффекта не получил. Тогда, в отчаянии, я стал искать более извращённые способы получения этого эффекта...
Первым делом мне в голову пришла мысль использовать в качестве фона просто полупрозрачные иконки. Идея оказалась частично верной. Я выбрал именно формат иконки, т.к. GIF и JPG с полупрозрачным цветом не работают. А PNG в Photoshop чё-то у меня так полупрозрачным и не вышел. А под рукой оказался редактор иконок (IconXP v1.04). Вот им я и сделал такой финт. Как обычно, запустил Apache, MySQL, Opera и загрузил страницу (www.mrelf.h12.ru Smile), без интернета, конечно. Результат оказался весьма хороший - я увидел полупрозрачную панель, на которой красовался чёткий текст и картинки. Ради эксперимента, я загрузил эту же страницу в Internet Explorer и... облом! :angry: Эксплохер ничего полупрозрачного не показал, просто цвет и всё. Вот тогда я занялся темами про полупрозрачность, скачанными от куда-то из интернета (http://webdetector.w6.ru/stat-i/statiya_7.html, http://sitemaker.ru/forum/showthread.php...eadid=2098, http://xpoint.ru/forums/thread.xhtml?act...d&id=18767, http://vbkoders.net.ru/info/info.asp?typ...cles&id=66). Наконец, вскоре я добился работы описанного способа - использование фильтра в CSS:
Код:
    filter: alpha( style=0, opacity=50 );
Но меня уже ждал новый облом! :angry: Моя изначальная ошибка заключалась в том, что я хотел добиться работы этой фишки в Опере, а, как оказалось, она работает только в Эксплохере... Sad
Вскоре я нашёл ещё статей про PNG картинки, нашёл редактор более-менее подзодящий и сделал PNG с полупрозрачностью. Эффект получился точно такой же, как и от иконки - видно только в Опере. И, вдруг, меня осинило Smile - ведь можно спокойно слепить два метода в один:
Код:
    filter: alpha( style=0, opacity=50 );
    background: url(style_images/<#IMG_DIR#>/orange.png);
Я уже был готов к тому, что наконец добился желаемого результата, но........ Меня уже ждал очередной облом! :angry: В Опере все полупрозрачные элементы были насыщенными и яркими, а в Эксплохере - бледными и тусклыми.... Это меня поставило окончательно в тупик. Sad


Собсно, к чему всё это. Smile Никто не знает, если такой параметр CSS, который будет работать только в Internet Explorer'е и будет изменять цветовые характеристики объекта (ну, оттенок, насыщенность и т.п.) ??
Ответ
#2
Слшиком всё просто у тебя, а вот почему:
Ты забыл упомянуть о Netscape и Mozilla Big Grin
И вовсе умолчал такой язык, как JavaScript. Smile
Ответ
#3
Так вроде, Netscape и Mozilla поддерживают формат PNG-24, значит, по идее, оно должно просвечиваться. Качать их при ужасной скорости у меня денег нет. Sad Jet, а что, Java здесь поможет? Это ж нужно менять свойства уже сгенерированного объекта, она такое может? Huh
Ответ
#4
В интернете(сайт http://htnew.manual.ru/forum/view.php?thread=17296) про это вот так написано:
Цитата:Чтобы прозрачность работала во всех браузерах,
достаточно использовать CSS-правило:
.class {
/* по спецификации CSS */
opacity: 0.5;
/* адаптация для старых версий Mozilla */
-moz-opacity: 0.5;
/* адаптация для IE */
filter:alpha(opacity=50);
}
Ответ


Перейти к форуму:


Пользователи, просматривающие эту тему: 1 Гость(ей)