Javascript-форум (https://javascript.ru/forum/)
-   jQuery (https://javascript.ru/forum/jquery/)
-   -   Кроссбраузерное закругление углов (https://javascript.ru/forum/jquery/18117-krossbrauzernoe-zakruglenie-uglov.html)

Freakmeister 17.06.2011 19:43

Кроссбраузерное закругление углов
 
Закруглил углы этой библиотекой: http://jquery.malsup.com/corner/
Но в проклятом IE оно почему-то не работает: http://maestro-magnifico.ru/
Как сделать кроссбраузерно? :(

walik 17.06.2011 20:41

Работает в IE. Покажи код как ты закругляешь.

Freakmeister 19.06.2011 15:37

$('.content, .green_message').corner("keep 7px");
$('.capture').corner("top 6px");
$('.nav li, #lastposts').corner("bottom 6px");
$('.news, .error').corner("keep 6px");
$('#header').corner("bottom keep 9px");
$('#header-left, #header-right').corner("bottom keep 8px");

Freakmeister 19.06.2011 17:11

В IE работает само закругление, но там точно не работает 2 функции этого плагина - сглаживание и дирректива "keep", которая должна оставлять закруглённый бордер.
Короче, я пришёл к выводу, что есть только один по настоящему кроссбраузерный метод:
http://www.schillmania.com/projects/dialog/

Freakmeister 21.06.2011 14:51

Додумал ещё способ кроссбраузерного закругления, с использованием библиотеки из первого поста.) Решил остановиться на нём, как на наиболее простом. Как я писал выше, атрибут "keep" не кроссбраузерный, но если вокруг элемента нужны закруглённые бордеры, как в моём случае, то их можно сделать так:
<div class="green_shell"><div class="green_message"><a href="#">x</a><p>Ваше сообщение отправлено.</p></div></div>
$('.green_message').corner("7px");
$('.green_shell').corner("8px");

Код:

.green_shell {
background-color: green;
margin: 5px;
padding: 1px;
}

.green_message {
background-color: #C0FFC0;
display: none;
}
.green_message p {
padding: 6px;
}
.green_message a {
float: right;
margin-right: 3px;
cursor: pointer;
text-decoration: none;
color: #333333;
}
.green_message a:hover {
color: green;
text-decoration: none;
}

Надеюсь, кому-нибудь будет полезно. :)

trikadin 21.06.2011 15:10

Вот тут или тут. Идеально решают вашу проблему.

bayrach 22.06.2011 09:58

css3 + pie чем не вариант? я вот недавно перешел на эту связку и всё гуд

trikadin 22.06.2011 13:43

Цитата:

Сообщение от bayrach
css3 + pie чем не вариант? я вот недавно перешел на эту связку и всё гуд

Согласен, хорошая библиотека, но иногда при вёрстке возникают сложности.

tenshi 27.06.2011 11:42

http://nin-jin.github.com/web-compon...c-css3.doc.xml


Часовой пояс GMT +3, время: 00:33.