Сегодня в своей работе пришлось столкнуться с задачей реализации у блоков круглых углов. Причем, как с нулевой границей, так и с существующей. Немаловажна прозрачность. И без всяких картинок. Без лишних div-ов.
Подобные вещи реализуются, насколько мне известно, только скриптами.
Было рассмотрено пока два (не было времени) варианта:
1. Проект Сергея Чикуенка Rocon
2. Проект СurvyСorners.
Оба решения достаточно легко внедряются на страничку. Причем, вариант Сергея обладает большей лаконичность, а 2-й - большей гибкостью.
Итого, плюсы и минусы:
1. Скорость. Работа Rocon незаметна. CurvyCorners заметно тормозит, так как взаимодействует с целевыми элементами после загрузки страницы. При изменении размеров окна, блоки не меняют своих размеров, так как скрипт заменяет все относительные величины на статичные (те, что были высчитаны на момент работы скрипта). Поэтому, это несколько косяк.
2. Внешний вид. Уголки Чикуенка,, на мой взгляд - пример для подражания, в то время, как у КурвиКорнерсов они слегка "грязноваты".
3. Кроссбраузерность. Тестировалось на последних версиях Firefox, Safari, Google Chrome, Opera и на 7-м Осле Мелкософта. Вот тут работа Чикуенка разочаровала. Десятая Опера оставляла рудиментарные острые углы наряду с уже округленными. А Осел кроме того в некоторые моменты оставлял целые куски каркаса (если блок был с границей), оставляя что-то крайне ужасное. В данном случае речь идет о div-ах с display: inline-block).
CurvyCorners пока оправдывают свою заявленную кроссбраузерность.
Собственно, пока мой выбор за СurvyСorners.
© 2009, web-vamg.com
Комментариев нет:
Отправить комментарий