Mithgol 25 мар 2011 в 11:55

Вышла третья бета PIE 1.0

3 мин

7.7K

CSS*

Перевод

+67

Комментарии 46

VitaZheltyakov 25 мар 2011 в 12:15

Просто замечательная новость.
Давно использую PIE — этот «костыль» настоящая панацея для верстальщика.

Nikelandjelo 25 мар 2011 в 12:30

Я может что-то не так делаю:
Захожу на их сайт в ie 7. А демо не работает. Т.е. просто серый квадрат без всяких там углов и цветов. Нажимал на чекбоксы — не помогло.

Mithgol 25 мар 2011 в 12:36

Я зашёл в IE6, всё работает.

IE7 под рукою нет, проверить не могу.

hacenator 25 мар 2011 в 12:50

Всё, работает. Сначала немного задумался, а потом заработал.

tapazukk 25 мар 2011 в 12:52

Конечно закругление уголков у img — это интересный как «пирожок» для только ИЕ. В других браузерах border-radius не применим к элементу img. Так, что проще по старинке — динамически создавать блочный элемент у которого бэгграунд нужное нам изображение, скруглять его, а для самой картинки проставлять opacity. (как один из вариантов).
Но новость позитивная, давно пользуюсь PIE — в разы увеличивает разработку.

Mithgol 25 мар 2011 в 13:23

Во браузере Firefox 4 свойство border-radius замечательно действует на <img>-элементы (соответствующий баг исправили в сентябре 2010 года).

Serator 25 мар 2011 в 14:00

Firefox 4 и Chrome 10 нормально закругляют углы у элемента «img».

НЛО прилетело и опубликовало эту надпись здесь

hacenator 25 мар 2011 в 12:53

А я вот не вижу особого смысла. Лучше «заставить» пользователя перейти на более новую версию браузера и пользоваться полноценной поддержкой всех фитч, чем использовать какие-то костыли вроде этого.

Я знаю, вы тут можете написать много «НО», но я сомневаюсь, что какие-то из них окажутся действительно весомыми основаниями пользоваться этим.

Ruster 25 мар 2011 в 16:19

есть очень большое «НО» — IE8
вот только не нужно говорить что и под IE8 ненужно сайт оптимизировать и так далее…
я тоже использую давно PIE и просто восторге от него.

я все сайта оптимизирую под IE7+
под IE6 верстаю только по желанию клиента и за под. плату.

hacenator 25 мар 2011 в 16:59

Скажу же — «ненужно сайт оптимизировать под IE8».
Допустим и Firefox 3.6 не поймет свойство radius. И я думаю что и здесь не следует ничего менять, и я не стану писать какие-то дополнительные костыли.
Но вот одно достойное НО вы всё же указали — «только по желанию клиента и за доп. плату.».

Я тут проведу небольшую аналогию. Все наверное помнят 3D Analyzer и как в начале второго тысячелетия появились «шейдеры» на видео картах. И старые железяки типа популярного тогда GeForce 440 не поддерживали новых «шейдеров» и чтобы поиграть приходилось использовать эмуляцию предоставляемую 3D Analyzer. Но тогда же вы тоже задумывались о покупке новой видео карты и не собирались сидеть на 3D Analyzer до скончания веков?
Зачем поощрять пользователя сидеть на старых браузерах, если есть хорошие, новые альтернативы? Мне кажется это глупо. Тем более глупо, писать что-то для этого и проделывать эту работу до версии «1.0 beta 3».

Ruster 25 мар 2011 в 17:48

Я сам веб-дизайнер/верстальщик.
И занимаюсь создание сайтов уже давно.

Приведу пример.
Вы владелец фирмы по производству моторов.
Вы пришли ко меня заказать верстку сайта.

И я вам говорю:
Ну в FF 3.6 не будет работать border-radius и много чего еще…
Сайт в IE7-IE8 вообще смотреть не нужно, там все формы друг на друга пошли, но это же не важно, посетителям сайта же не трудно установить новейший браузер и самое главное не от Microsoft.

Вы будет после этого у меня заказывать или закажите работу у другого верстальщика кто сделает работу так? чтобы везде все работала нормально и один в один?

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

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

hacenator 25 мар 2011 в 18:05

Значит у нас разный подход.
Дизайнеры вместе с которыми работаю я учитывают возможности браузеров и делают все фичи опциональными т.е. даже если ie6 чего-то не поддерживает из того что есть в странице, то пользователь при просмотре страницы этим браузером не испытает дискомфорта или не получит чего-то пугающего.

«и у них возникла желание купить ваши моторы» моторы как раз не мои, а заказчика сайта, хочет больше продаж — делает сайт лучше, платит больше. Я знаю что у нас очень много проблем с «не понимающими» заказчиками, это очень плохо и тяжело.

И я обосную свою позицию просто. Иногда возможно я слишком «зануда», но я очень не люблю «костыли», ненавижу. Это как-то поганит весь код, это становится проблемой. Они воспринимаются мной как изъяны. Именно поэтому, чтобы получить что-то потрясающие, я стараюсь использовать их как много реже.

Mithgol 26 мар 2011 в 07:40

Мы сейчас говорим о библиотеке, которая добавлением единственного свойства «behaviour: url(/pie.htc)» (ну ещё, может быть, «-pie-watch-ancestors: …» да «-pie-background: …» в отдельных случаях) обеспечивает поддержку дюжины декоративных свойств: закругление углов, тени блоков, одномерные текстуры, множественные и градиентные фоны. Эти свойства захламляют код не более, чем необходимость указывать целый ряд собственнических «-префиксов-» — например, для поворота:

     -moz-transform: rotate(7.5deg);  
       -o-transform: rotate(7.5deg);  
  -webkit-transform: rotate(7.5deg);  
      -ms-transform: rotate(7.5deg);  
          transform: rotate(7.5deg);  
             filter: progid:DXImageTransform.Microsoft.Matrix(
                      M11=0.9914448613738104,
                      M12=-0.13052619222005157,
                      M21=0.13052619222005157,
                      M22=0.9914448613738104,
                      sizingMethod='auto expand');
               zoom: 1;

hacenator 26 мар 2011 в 13:22

От вас требуют сайты со всеми этими фичами? Или без них невозможно сделать нормальный дизайн?

loat 25 мар 2011 в 12:56

вчера как раз пробовал ее использовать. Был блок с прозрачностью и закругленными уголками. Когда CSS3PIE закруглял уголки, то пропадала прозрачность.

Mithgol 25 мар 2011 в 13:25

А как достигалась прозрачность блока?

loat 25 мар 2011 в 13:28

-ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=86);
filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=86);

Mithgol 25 мар 2011 в 13:47

Понятно.

Ну что же, в таких обстоятельствах следует призадуматься об обходном пути.

Например, если блок этот в основном однотонный, то можно ограничиться прозрачностью одного только фона его, задав RGBA-цвет в CSS-свойстве -pie-background.

Или можно ещё попробовать заключить этот блог в невидимый родительский контейнер (наделённый прозрачным фоном и нулевыми margin, padding и border) — и этому-то контейнеру назначить желаемую прозрачность. (PIE-элементы должны, по логике кода, попасть внутрь того же контейнера — на практике я не проверял это, правда…)

loat 25 мар 2011 в 13:54

Просто для себя решил, что использовать это еще очень рано. Слишком уж он сырой. Лучше потратить немного больше времени и сделать отдельный CSS для ослов.

Mew 25 мар 2011 в 14:31

Специально счас проверил, сымитировав ваш случай — все прекрасно работает.
position: relative пробовали ставить? А белый бэкграунд прописать прозрачному фону?
И вообще, за долгое время исп-ия глюков было довольно мало и их без проблем можно было обойти. Зато времени сэкономлено вагон + возможность последующих изменений есть.
Имхо, не стоит делать выводы от того, что у вас 1н глюк выскочил, который наверняка преодолим в пол секунды.

loat 25 мар 2011 в 14:45

зачем мне белый бэкграунд если он у меня другой?
Глюк у меня выскочил через 10 минут после того как я его скачал, поэтому такие выводы.

Mew 25 мар 2011 в 15:50

непрально выразился. Имел ввиду — задан ли бэкграунд блоки вообще?
Часто проблема выскакивает из-за отсутствия свойства relative у проблемного блока, и об этом четко написано на сайте pie.
Рекомендую вам дать еще один шанс PIE.

Mithgol 25 мар 2011 в 13:55

Опечатка: вместо «блог» следует читать «блок».

Boomburum 25 мар 2011 в 12:58

Всегда приятно смотреть хорошо оформленную новость

Zerstoren 25 мар 2011 в 13:09

Впервые о ней слышу. Но по описанию уже Няяя =)

Опробую как нибудь на досуге.

medved13 25 мар 2011 в 13:18

С такими штуками главное — не увлекаться. Чем к большему количеству элементов вы подключаете «костыль», тем медленнее работает страница. Так что, для высоконагруженных, больших страниц — не рекомендуется.

НЛО прилетело и опубликовало эту надпись здесь

Loner 25 мар 2011 в 14:35

О да! Сам с таким сталкивался. И это немного печалит.

zwie 25 мар 2011 в 15:42

Так может это и неплохо — ЦА этого костыля призадумается, почему у них работает все ооочень медленно, а на соседнем компьютере — нормально?

zkv 25 мар 2011 в 13:45

так как ещё не ясно, что IE9 будет поддерживать в окончательной версии

Вообще-то уже ясно, что он поддерживает.

Mithgol 25 мар 2011 в 13:49

Если бы Вы внимательно прочли моё предисловие, то могли бы видеть там, что эта блогозапись была составлена автором PIE 6 декабря 2010 года — а ведь тогда он, понятное дело, не мог ещё совершенно прозревать грядущее (нынешнее) положение дел с IE9.

Hellcunt 25 мар 2011 в 15:10

Почему вы пишите «блогозаписть», а не топик или пост?

TiGR 25 мар 2011 в 16:54

Потому что он Мицгол.

Hellcunt 25 мар 2011 в 17:00

Это несомненно :)

Тут более тонкое намечалось. Я ожидал, что Мицгол скажет, что «топик» это не по-русски. А я бы у него спросил, а насколько по-русски «блог»? И всем стало бы смешно.

bolk 26 мар 2011 в 00:29

Было бы смешно, если бы он сказал, что слова «пост» в русском нету :)

Mithgol 26 мар 2011 в 07:16

Я скажу нечто совершенно обратное: слово «пост» в русском языке есть, причём оно в нём и так весьма омонимично, поскольку (в зависимости от контекста) может означать либо занимаемую должность (скажем, «высокий пост»), либо вероисповедное воздержание (например, «Великий Пост»), либо место наблюдения (допустим, «пост ГАИ»), так что куда уж ещё более перегружать его. (Эксэссив оўерлоадинѓ, ю андэстэнд?)

Что же касается слова «топик», то оно может ведь означать и сабджект мессаги, а это не олрайт.

Loner 25 мар 2011 в 14:20

Спасибо авторам.

TiGR 25 мар 2011 в 16:55

Интересно, в этой версии добавили поддержку горизонтально-ориентированных градиентов?

pxx 25 мар 2011 в 18:55

Большое спасибо, это очень своевременно. На следующей неделе нужно будет верстать немаленький корпоративный сайт, где огромное количество всяких скруглений и прочих небанальных вещей. С помощью css3please.com/ многие вещи удалось реализовать красиво и семантично, но скругленны уголки начали на меня навевать печаль. Обязательно попробую.

AnGr 26 мар 2011 в 11:11

Вот предела радости моей не было, когда однажды мне показали ie7-js, который кое-какие мелочи для IE умеет исправлять. Про PIE только недавно на собеседовании нечаянно услышали, когда спросили меня, как я с полупрозрачными PNG воюю. Надо попробовать (даже сегодня вечером), так как последний заказчик на вопрос «Нам нужны все красивости в IE6» ответил утвердительно. А предлагает он за сайт достаточно.
Но скажу честно — для личных проектов, которые разрабатываю на свои кровные верстаю так, чтобы в IE7 все было на 80% отлично, в IE8 на 95%, а для пользователей IE6 предлагаю установить Chrome Frame, а для особо испуганных/незнающих вешаю баннер над контентом с объяснениями, что не так, и предложениями присмотреть себе более качественный браузер.

Tenphi 26 мар 2011 в 11:50

И всё-таки лучше поздно чем никогда. Замечательный костылёк.
У меня всё заработало, только вот непонятно, почему разработчики не сделали поддержку выборочного закругления:
border-bottom-right-radius: 9px;