Хабр Курсы для всех
РЕКЛАМА
Практикум, Хекслет, SkyPro, авторские курсы — собрали всех и попросили скидки. Осталось выбрать!
Хабр доступен 24/7 благодаря поддержке друзей
Комментарии 46
Просто замечательная новость.
Давно использую PIE — этот «костыль» настоящая панацея для верстальщика.
Давно использую PIE — этот «костыль» настоящая панацея для верстальщика.
Я может что-то не так делаю:
Захожу на их сайт в ie 7. А демо не работает. Т.е. просто серый квадрат без всяких там углов и цветов. Нажимал на чекбоксы — не помогло.
Захожу на их сайт в ie 7. А демо не работает. Т.е. просто серый квадрат без всяких там углов и цветов. Нажимал на чекбоксы — не помогло.
Конечно закругление уголков у img — это интересный как «пирожок» для только ИЕ. В других браузерах border-radius не применим к элементу img. Так, что проще по старинке — динамически создавать блочный элемент у которого бэгграунд нужное нам изображение, скруглять его, а для самой картинки проставлять opacity. (как один из вариантов).
Но новость позитивная, давно пользуюсь PIE — в разы увеличивает разработку.
Но новость позитивная, давно пользуюсь PIE — в разы увеличивает разработку.
Во браузере Firefox 4 свойство border-radius замечательно действует на <img>-элементы (соответствующий баг исправили в сентябре 2010 года).
Firefox 4 и Chrome 10 нормально закругляют углы у элемента «img».
А я вот не вижу особого смысла. Лучше «заставить» пользователя перейти на более новую версию браузера и пользоваться полноценной поддержкой всех фитч, чем использовать какие-то костыли вроде этого.
Я знаю, вы тут можете написать много «НО», но я сомневаюсь, что какие-то из них окажутся действительно весомыми основаниями пользоваться этим.
Я знаю, вы тут можете написать много «НО», но я сомневаюсь, что какие-то из них окажутся действительно весомыми основаниями пользоваться этим.
есть очень большое «НО» — IE8
вот только не нужно говорить что и под IE8 ненужно сайт оптимизировать и так далее…
я тоже использую давно PIE и просто восторге от него.
я все сайта оптимизирую под IE7+
под IE6 верстаю только по желанию клиента и за под. плату.
вот только не нужно говорить что и под IE8 ненужно сайт оптимизировать и так далее…
я тоже использую давно PIE и просто восторге от него.
я все сайта оптимизирую под IE7+
под IE6 верстаю только по желанию клиента и за под. плату.
Скажу же — «ненужно сайт оптимизировать под IE8».
Допустим и Firefox 3.6 не поймет свойство radius. И я думаю что и здесь не следует ничего менять, и я не стану писать какие-то дополнительные костыли.
Но вот одно достойное НО вы всё же указали — «только по желанию клиента и за доп. плату.».
Я тут проведу небольшую аналогию. Все наверное помнят 3D Analyzer и как в начале второго тысячелетия появились «шейдеры» на видео картах. И старые железяки типа популярного тогда GeForce 440 не поддерживали новых «шейдеров» и чтобы поиграть приходилось использовать эмуляцию предоставляемую 3D Analyzer. Но тогда же вы тоже задумывались о покупке новой видео карты и не собирались сидеть на 3D Analyzer до скончания веков?
Зачем поощрять пользователя сидеть на старых браузерах, если есть хорошие, новые альтернативы? Мне кажется это глупо. Тем более глупо, писать что-то для этого и проделывать эту работу до версии «1.0 beta 3».
Допустим и Firefox 3.6 не поймет свойство radius. И я думаю что и здесь не следует ничего менять, и я не стану писать какие-то дополнительные костыли.
Но вот одно достойное НО вы всё же указали — «только по желанию клиента и за доп. плату.».
Я тут проведу небольшую аналогию. Все наверное помнят 3D Analyzer и как в начале второго тысячелетия появились «шейдеры» на видео картах. И старые железяки типа популярного тогда GeForce 440 не поддерживали новых «шейдеров» и чтобы поиграть приходилось использовать эмуляцию предоставляемую 3D Analyzer. Но тогда же вы тоже задумывались о покупке новой видео карты и не собирались сидеть на 3D Analyzer до скончания веков?
Зачем поощрять пользователя сидеть на старых браузерах, если есть хорошие, новые альтернативы? Мне кажется это глупо. Тем более глупо, писать что-то для этого и проделывать эту работу до версии «1.0 beta 3».
Я сам веб-дизайнер/верстальщик.
И занимаюсь создание сайтов уже давно.
Приведу пример.
Вы владелец фирмы по производству моторов.
Вы пришли ко меня заказать верстку сайта.
И я вам говорю:
Ну в FF 3.6 не будет работать border-radius и много чего еще…
Сайт в IE7-IE8 вообще смотреть не нужно, там все формы друг на друга пошли, но это же не важно, посетителям сайта же не трудно установить новейший браузер и самое главное не от Microsoft.
Вы будет после этого у меня заказывать или закажите работу у другого верстальщика кто сделает работу так? чтобы везде все работала нормально и один в один?
И не стоит забывать что вам по сути все равно с какого брузера смотрят ваш сайт ваши посетители (они же потенциальные клиенты), для вас важно чтобы у них все отображалось нормально и у них возникла желание купить ваши моторы.
И не стоит забывать о том что ооочень многие пользователи не умеют обновлять браузеры, и даже не знаю что значит слово «браузер», они купили компьютер с магазина принесли домаю и пользуются ею, и браузер они обновят, только когда ихний компьютер испортиться и они купят новый.
И занимаюсь создание сайтов уже давно.
Приведу пример.
Вы владелец фирмы по производству моторов.
Вы пришли ко меня заказать верстку сайта.
И я вам говорю:
Ну в FF 3.6 не будет работать border-radius и много чего еще…
Сайт в IE7-IE8 вообще смотреть не нужно, там все формы друг на друга пошли, но это же не важно, посетителям сайта же не трудно установить новейший браузер и самое главное не от Microsoft.
Вы будет после этого у меня заказывать или закажите работу у другого верстальщика кто сделает работу так? чтобы везде все работала нормально и один в один?
И не стоит забывать что вам по сути все равно с какого брузера смотрят ваш сайт ваши посетители (они же потенциальные клиенты), для вас важно чтобы у них все отображалось нормально и у них возникла желание купить ваши моторы.
И не стоит забывать о том что ооочень многие пользователи не умеют обновлять браузеры, и даже не знаю что значит слово «браузер», они купили компьютер с магазина принесли домаю и пользуются ею, и браузер они обновят, только когда ихний компьютер испортиться и они купят новый.
Значит у нас разный подход.
Дизайнеры вместе с которыми работаю я учитывают возможности браузеров и делают все фичи опциональными т.е. даже если ie6 чего-то не поддерживает из того что есть в странице, то пользователь при просмотре страницы этим браузером не испытает дискомфорта или не получит чего-то пугающего.
«и у них возникла желание купить ваши моторы» моторы как раз не мои, а заказчика сайта, хочет больше продаж — делает сайт лучше, платит больше. Я знаю что у нас очень много проблем с «не понимающими» заказчиками, это очень плохо и тяжело.
И я обосную свою позицию просто. Иногда возможно я слишком «зануда», но я очень не люблю «костыли», ненавижу. Это как-то поганит весь код, это становится проблемой. Они воспринимаются мной как изъяны. Именно поэтому, чтобы получить что-то потрясающие, я стараюсь использовать их как много реже.
Дизайнеры вместе с которыми работаю я учитывают возможности браузеров и делают все фичи опциональными т.е. даже если ie6 чего-то не поддерживает из того что есть в странице, то пользователь при просмотре страницы этим браузером не испытает дискомфорта или не получит чего-то пугающего.
«и у них возникла желание купить ваши моторы» моторы как раз не мои, а заказчика сайта, хочет больше продаж — делает сайт лучше, платит больше. Я знаю что у нас очень много проблем с «не понимающими» заказчиками, это очень плохо и тяжело.
И я обосную свою позицию просто. Иногда возможно я слишком «зануда», но я очень не люблю «костыли», ненавижу. Это как-то поганит весь код, это становится проблемой. Они воспринимаются мной как изъяны. Именно поэтому, чтобы получить что-то потрясающие, я стараюсь использовать их как много реже.
Мы сейчас говорим о библиотеке, которая добавлением единственного свойства «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;
вчера как раз пробовал ее использовать. Был блок с прозрачностью и закругленными уголками. Когда CSS3PIE закруглял уголки, то пропадала прозрачность.
А как достигалась прозрачность блока?
-ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=86);
filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=86);
filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=86);
Понятно.
Ну что же, в таких обстоятельствах следует призадуматься об обходном пути.
Например, если блок этот в основном однотонный, то можно ограничиться прозрачностью одного только фона его, задавRGBA-цвет в CSS-свойстве -pie-background.
Или можно ещё попробовать заключить этот блог в невидимый родительский контейнер (наделённый прозрачным фоном и нулевыми margin, paddingи border) — и этому-то контейнеру назначить желаемую прозрачность. (PIE-элементы должны, по логике кода, попасть внутрь того же контейнера — на практике я не проверял это, правда…)
Ну что же, в таких обстоятельствах следует призадуматься об обходном пути.
Например, если блок этот в основном однотонный, то можно ограничиться прозрачностью одного только фона его, задав
Или можно ещё попробовать заключить этот блог в невидимый родительский контейнер (наделённый прозрачным фоном и нулевыми margin, padding
Просто для себя решил, что использовать это еще очень рано. Слишком уж он сырой. Лучше потратить немного больше времени и сделать отдельный CSS для ослов.
Специально счас проверил, сымитировав ваш случай — все прекрасно работает.
position: relative пробовали ставить? А белый бэкграунд прописать прозрачному фону?
И вообще, за долгое время исп-ия глюков было довольно мало и их без проблем можно было обойти. Зато времени сэкономлено вагон + возможность последующих изменений есть.
Имхо, не стоит делать выводы от того, что у вас 1н глюк выскочил, который наверняка преодолим в пол секунды.
position: relative пробовали ставить? А белый бэкграунд прописать прозрачному фону?
И вообще, за долгое время исп-ия глюков было довольно мало и их без проблем можно было обойти. Зато времени сэкономлено вагон + возможность последующих изменений есть.
Имхо, не стоит делать выводы от того, что у вас 1н глюк выскочил, который наверняка преодолим в пол секунды.
Опечатка: вместо «блог» следует читать «блок».
Всегда приятно смотреть хорошо оформленную новость
Впервые о ней слышу. Но по описанию уже Няяя =)
Опробую как нибудь на досуге.
Опробую как нибудь на досуге.
С такими штуками главное — не увлекаться. Чем к большему количеству элементов вы подключаете «костыль», тем медленнее работает страница. Так что, для высоконагруженных, больших страниц — не рекомендуется.
так как ещё не ясно, что IE9 будет поддерживать в окончательной версии
Вообще-то уже ясно, что он поддерживает.
Если бы Вы внимательно прочли моё предисловие, то могли бы видеть там, что эта блогозапись была составлена автором PIE 6 декабря 2010 года — а ведь тогда он, понятное дело, не мог ещё совершенно прозревать грядущее (нынешнее) положение дел с IE9.
Почему вы пишите «блогозаписть», а не топик или пост?
Потому что он Мицгол.
Это несомненно :)
Тут более тонкое намечалось. Я ожидал, что Мицгол скажет, что «топик» это не по-русски. А я бы у него спросил, а насколько по-русски «блог»? И всем стало бы смешно.
Тут более тонкое намечалось. Я ожидал, что Мицгол скажет, что «топик» это не по-русски. А я бы у него спросил, а насколько по-русски «блог»? И всем стало бы смешно.
Было бы смешно, если бы он сказал, что слова «пост» в русском нету :)
Я скажу нечто совершенно обратное: слово «пост» в русском языке есть, причём оно в нём и так весьма омонимично, поскольку (в зависимости от контекста) может означать либо занимаемую должность (скажем, «высокий пост»), либо вероисповедное воздержание (например, «Великий Пост»), либо место наблюдения (допустим, «пост ГАИ»), так что куда уж ещё более перегружать его. (Эксэссив оўерлоадинѓ, ю андэстэнд?)
Что же касается слова «топик», то оно может ведь означать и сабджект мессаги, а это не олрайт.
Что же касается слова «топик», то оно может ведь означать и сабджект мессаги, а это не олрайт.
Спасибо авторам.
Интересно, в этой версии добавили поддержку горизонтально-ориентированных градиентов?
Большое спасибо, это очень своевременно. На следующей неделе нужно будет верстать немаленький корпоративный сайт, где огромное количество всяких скруглений и прочих небанальных вещей. С помощью css3please.com/ многие вещи удалось реализовать красиво и семантично, но скругленны уголки начали на меня навевать печаль. Обязательно попробую.
Вот предела радости моей не было, когда однажды мне показали ie7-js, который кое-какие мелочи для IE умеет исправлять. Про PIE только недавно на собеседовании нечаянно услышали, когда спросили меня, как я с полупрозрачными PNG воюю. Надо попробовать (даже сегодня вечером), так как последний заказчик на вопрос «Нам нужны все красивости в IE6» ответил утвердительно. А предлагает он за сайт достаточно.
Но скажу честно — для личных проектов, которые разрабатываю на свои кровные верстаю так, чтобы в IE7 все было на 80% отлично, в IE8 на 95%, а для пользователей IE6 предлагаю установить Chrome Frame, а для особо испуганных/незнающих вешаю баннер над контентом с объяснениями, что не так, и предложениями присмотреть себе более качественный браузер.
Но скажу честно — для личных проектов, которые разрабатываю на свои кровные верстаю так, чтобы в IE7 все было на 80% отлично, в IE8 на 95%, а для пользователей IE6 предлагаю установить Chrome Frame, а для особо испуганных/незнающих вешаю баннер над контентом с объяснениями, что не так, и предложениями присмотреть себе более качественный браузер.
И всё-таки лучше поздно чем никогда. Замечательный костылёк.
У меня всё заработало, только вот непонятно, почему разработчики не сделали поддержку выборочного закругления:
border-bottom-right-radius: 9px;
У меня всё заработало, только вот непонятно, почему разработчики не сделали поддержку выборочного закругления:
border-bottom-right-radius: 9px;
Новость довольно старая (декабрь 2010).
Думал обновиться, но понял, что уже стоит 3-я бета.
Думал обновиться, но понял, что уже стоит 3-я бета.
четвёртого апреля вышла четвёртая бета.
Надо было так и назвать — костыль, ибо работает соответствующе.
В ИЕ 9 через задницу все, днем работало, сейчас прочистил кеши уже не работает.
В ИЕ 9 через задницу все, днем работало, сейчас прочистил кеши уже не работает.
Зарегистрируйтесь на Хабре, чтобы оставить комментарий
Вышла третья бета PIE 1.0