скажите мне что-нибудь умное про файлы png

163

мартышон

31 марта 2007, 19:34

1114

Никогда с ними дело не имела, а тут на каком-то буржуйском сайте заметила интересный прикол: грузится фон, а потом сверху как бы блики света накладываются. Посмотрела как сделано - там поверх фона кладется полупрозрачный градиент в формате png. Не прозрачный, а именно полупрозрачный, то есть переход тона получается очень мягкий. Но вот беда: Когда я такой же полупрозрачный градиент в формате png кладу на свой фон, он у меня почему-то просвечивать не хочет. В фотошопе его открываю - симпатичная такая растяжка от рыжего к прозрачному. А в ИЕ получается растяжка от рыжего к голубому. Откуда, спрашивается, этот голубой взялся? Не понимаю.

163

мартышон

31 марта 2007, 19:39

#1

Ага, кое-что уже прояснилось. Это в лисе он прозрачный, а в ИЕ нет.

Но вопросы остались. Может, можно где-то прочитать про этот формат, в каких случаях его целесообразно использовать? И есть ли какой-то способ сделать так, чтобы он в ИЕ сохранял прозрачность?

3 месяца Google не Упал трафик в Яндекс Влияние коммерческого ключевого слова

197

Петр Елагин

31 марта 2007, 19:46

#2

мартышон:
Никогда с ними дело не имела, а тут на каком-то буржуйском сайте заметила интересный прикол: грузится фон, а потом сверху как бы блики света накладываются. Посмотрела как сделано - там поверх фона кладется полупрозрачный градиент в формате png. Не прозрачный, а именно полупрозрачный, то есть переход тона получается очень мягкий. Но вот беда: Когда я такой же полупрозрачный градиент в формате png кладу на свой фон, он у меня почему-то просвечивать не хочет. В фотошопе его открываю - симпатичная такая растяжка от рыжего к прозрачному. А в ИЕ получается растяжка от рыжего к голубому. Откуда, спрашивается, этот голубой взялся? Не понимаю.

Пользуйтесь гифами и джипегами, у меня была проблема, когда в пнг надо было сделать прозрачный цвет. в лисе и опере все ок. а вот в ие нет =(

https://shareways.ru

61

Real

31 марта 2007, 19:54

#3

AlienZzzz:
Пользуйтесь гифами и джипегами

В жпеге нет прозрачности, а гиф не всегда нужную глубину цвета тянет.

мартышон, Это глюк шестого ослика. Он не понимает пнг как надо. Там даже цвета отображаются немного не так (вроде небольшое смещение вверх по хекс коду идет).

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

он самый (http://alexvolkov.ru)

eTarget 2011:Панельная дискуссия «Стратегия eTarget 2011: Круглый стол Могут ли «плохие» входящие

31

Ёжик

31 марта 2007, 19:56

#4

http://www.w3.org/Graphics/PNG/

7

Magnet

31 марта 2007, 20:00

#5

Про формат этот (даже лишку) - http://rus-linux.net/zen/png_feature/png_feature.html

По поводу отображения (полностью поддерживает только 7 Эксплорер) можно тут почитать, сам правда не пробовал, вспомнилось - http://www.nbsp.ru/articles/2003/02/18/prozrachnyi_png.html#comments

Софт, СЕО и около (http://my-site.name/) - мой блог.

304

tommy-gung

31 марта 2007, 20:01

#6

мартышон, можно начать читать отсюда http://ru.wikipedia.org/wiki/PNG Тут же есть подборка ссылок

Показываем PNG в IE http://www.artlebedev.ru/tools/technogrette/html/png_in_ie/

удачи в изучении :)

Здесь не могла быть ваша реклама

61

Real

31 марта 2007, 20:02

#7

Magnet:
полностью поддерживает только 7 Эксплорер

Для шестого патч вроде был.

163

мартышон

31 марта 2007, 20:46

#8

Спасибо всем ответившим. Пошла читать :)

118

deedee

1 апреля 2007, 09:42

#9

я делаю так:

в стилях прописываю {background: url(ваш.png); background-image:expression('none'); filter: progid: DXImageTransform.Microsoft.AlphaImageLoader(src='ваш.png', sizingMethod='crop');}

Работает в лисе, опере, IE 6+

ПЗ

92

Павел Зотов

1 апреля 2007, 10:02

#10

Чтобы в IE нормально показывались png

Просто в <head>...</head> вставляете следующий код:


<!--[if gte IE 5.5000]>
 <script language="JavaScript">
 function correctPNG() // correctly handle PNG transparency in Win IE 5.5 or higher.
    {
    for(var i=0; i<document.images.length; i++)
       {
           var img = document.images
           var imgName = img.src.toUpperCase()
           if (imgName.substring(imgName.length-3, imgName.length) == "PNG")
              {
                  var imgID = (img.id) ? "id='" + img.id + "' " : ""
                  var imgClass = (img.className) ? "class='" + img.className + "' " : ""
                  var imgTitle = (img.title) ? "title='" + img.title + "' " : "title='" + img.alt + "' "
                  var imgStyle = "display:inline-block;" + img.style.cssText
                  if (img.align == "left") imgStyle = "float:left;" + imgStyle
                  if (img.align == "right") imgStyle = "float:right;" + imgStyle
                  if (img.parentElement.href) imgStyle = "cursor:hand;" + imgStyle              
                  var strNewHTML = "<span " + imgID + imgClass + imgTitle
                  + " style=\"" + "width:" + img.width + "px; height:" + img.height + "px;" + imgStyle + ";"
              + "filter:progid:DXImageTransform.Microsoft.AlphaImageLoader"
                  + "(src=\'" + img.src + "\', sizingMethod='scale');\"></span>"
                  img.outerHTML = strNewHTML
                  i = i-1
              }
       }
    }
 window.attachEvent("onload", correctPNG);
 </script>
 <![endif]-->

Автомобили в России (http://www.autobb.ru/). Спецтехника BIZ - вся строительная, дорожная, коммунальная техника (http://www.spectehnika.biz/) и другая спецтехника в одном месте.

Яндекс Вебмастер вынес товарные фиды в отдельный раздел

Что делать, чтобы попасть в ответы Google Bard