Закругление краев DIV'ов
в общем САБЖ, как закруглить края дивов, только без картинок, и желательно средствами jQuery, знаю что есть плагин для этой либы называется Corner но он криво работает, обрезает нижнюю строку текста который в диве лежит и к тому же я не смог его научить закруглять все края он закруглял только нижние, так что хелп
|
Под MooTools
http://fantactuka.net/canvasul/ А с тем, что под Jquery у меня проблем не было. А если и будут, то код там простейший, можно и самому подправить. Может у меня другой, просто называется также. Их много сейчас под Jquery. |
единственный достойный вариант который я нашел это: http://www.atblabs.com/jquery.corners.html
но у меня почему то углы отображаются только в опере а остальных нет, хотя в доках написано что работает на всех браузерах :( |
Цитата:
|
он дойстойный просто я его не могу достояно успользовать потому что примеры из доков нормально отображаются на всех браузерах, а то что я юзаю не работает :(
|
Доктайпы разные.
|
Посмотрел код немного. Про canvas ни слова. Дивами рисуется. Не люблю такое.
|
посоветуй что-нибудь дельное
|
Во, откопал:
http://labs.parkerfox.co.uk/cornerz/ |
таже хрень работает в опере и сафари а в мозилле и файрфоксе не работает(((
|
Цитата:
|
кароче беда, походу им мой DOM не нравится, просто когда обычный див с контентом текстовым все везде рабоатет тип топ, а у меня много вложенных дивов в один родительский и поэтому не пашет... переверстывать влом
|
<div id="menu"> <div align="right" class="header"> Меню </div> <div class="menuheader">Аренда</div> <div class="menuitem"><a href="#">Квартиры</a></div> <div class="menuitem"><a href="#">Коттеджи</a></div> <div class="menuheader">Продажа</div> <div class="menuitem"><a href="#">Квартиры</a></div> <div class="menuitem"><a href="#">Коттеджи</a></div> <div class="menuheader">Контакты</div> <div class="menuitem"><a href="#">Контакты</a></div> <div class="menuitem"><a href="#">Карта</a></div> <div class="menuheader">Партнеры</div> <div class="menuitem"><a href="#">Наши партнеры</a></div> <div class="menuheader">Предварительный заказ</div> <div class="menuitem"><a href="#">Заказать</a></div> </div> вот так: $("#menu").cornerz({radius:10}); не закругляет((((( причем если все изнутри дива #menu удалить все ок... |
В общем можете официально назвать меня критином...
было: <script type="text/javascript" src="corners.js" /> сделал: <script type="text/javascript" src="corners.js"></script> и все ок |
у меня даже предыдущий вариант работает :blink: хотя может тут уже дело в DOCTYPE
|
я же говорю, тут косяк не в скриптах и браузерах, а то что я весь вечер на танке сижу... и вместо головы жопа...
|
пользуюсь этим:
либа: http://www.dhtmlgoodies.com/index.ht...ounded-corners пример: http://www.dhtmlgoodies.com/scripts/...d-corners.html создает div с множеством вложенных div-ов разной ширины. выглядит красиво но код становится немного объемнее. |
Цитата:
|
Вложений: 1
>>> Выложите, пожалуйста, скрипт, а то http://fantactuka.net/canvasul/ не работает((
|
Riim, спасибо
|
Я тоже когда-то наткнулся на такой трюк, потом расковырял всё это дело и понял, в чём тут фикус. Подробно не буду описывать, т.к. лень, но если кто-то захочет в этом разобратся сам - опишу.
Взамен хотел бы скинуть вам простую функцию, которая просто поможет всё это понять. function createEle(ele,tag,className){ var e=document.createElement(tag); e.className=className; ele.appendChild(e); } function createRainbow(e,top){ var r=createEle(e,'div',(top)?'rtop':'rbottom'); if(top) for(i=14;i>=0;i--) createEle(r,'div','r'+i); else for(i=0;i<=14;i++) createEle(r,'div','r'+i); } Функция createEle просто в помощь, так что не придерацца. Использовать так: 1. У нас есть див (div). 2. В этот див генерим верхние углы: createRainbow(div,true). 3. Вставляем туда див для контента: createEle(div,'div',className). 4. Генерим нижние углы: createRainbow(div). Вот стили: .r1, .rbottom .r0{ height:1px; } .r10 { margin:0 8px; height:1px; } .r11 { margin:0 9px; height:1px; } .r12 { margin:0 11px; height:1px; } .r13 { margin:0 13px; height:1px; } .r14 { margin:0 16px; height:1px; } .r2 { margin:0 1px; height:3px; } .r3{ margin:0 2px; height:2px; } .r4, .r5 { margin:0 3px; height:1px; } .r6 { margin:0 4px; height:1px; } .r7 { margin:0 5px; height:1px; } .r8 { margin:0 6px; height:1px; } .r9 { margin:0 7px; height:1px; } .rbottom { width:100%; overflow:hidden; } .rtop { width:100%; overflow:hidden; } .rtop div, .rbottom div{ background:#000; overflow:hidden; } Этот пример не претендует на широкое использование. Запостилось для того, чтобы вы сами могли во всём разобраться и не мучиться с левыми библиотеками. После осознования сего, вы сами сможете написать полноценную либу скругления углов у дива. |
Помогите, пожалуйста, разобраться, как работает скрипт с сайта http://fantactuka.net/canvasul/.
Скрипт выдал мне код в виде архива. Я подключила скрипты и файл стилей, прописала div .underlayer - как предлагается. Но ничего не работает - даже на странице ничего не отображается. Как этот скрипт работает? Что я не учла? Кто имел с ним дело, помогите разобраться, плиз... |
Того скрипта там уже нет, там одна реклама. В 19 посте он выложен.
|
Riim, вы точно Рассеянный профессор
Я же написала, что не могу разобраться, как этот скрипт встроить в страницу сайта, а не "дайте ссылку на закачку". |
Цитата:
|
Там только сам скрипт, а никаких примеров нет.
Если не трудно, выложите где-нибудь пример. Может на какой либо файлообменник или в присоединенном архиве. Очень хочется разобраться, как это все работает. |
Цитата:
|
Riim, Вместо того, чтобы помочь страждущему вы играетесь словами.
Ну поигрались... А толку? |
ludmilal, я предлагаю вам еще раз скачать архив из 19-го поста и посмотреть его содержимое с широко открытыми глазами.
|
Скачала еще раз.
Распаковала архив canvasul.zip. Подключила стили и скрипты, который находились в архиве. Так нужен еще и html-код, который вставляется в страницу и который, собственно и образует сам блок - иначе для чего делать эти круглые углы и тени. Какой html-код? |
Архив называется rouned.zip а не canvasul.zip, вы что-то не то качаете.
|
В архиве, который называется rouned.zip вложен архив canvasul.zip.
Что вы придираетесь? Объяснили бы как этот скрипт настроить. |
Цитата:
|
index.html - это сам крипт. А как это перенести на мой сайт?
Как сделать, чтобы на моем сайте у блока были круглые уголки и тени? Может я бестолковая, но у меня никак не получается сделать, чтобы этот скрипт работал на моем сайте. Пожалуйста, расскажите, как сделать, чтобы на моем сайте у блока были круглые уголки и тени? Если можно - подробно. Что куда вставлять? |
Цитата:
|
Вспоминается работа в одной конторе, где приходилось 50-летних старушек учить пользоваться мышкой.
Цитата:
|
Вы, умники чертовы. Что, чувствуете себя выше, когда унизите кого-нибудь другого?
Нормальные люди возвышаются над другими благодаря своим достижениям, а не благодаря тому, что унижают других. |
Ну вот, опять мы плохие :(.
|
Цитата:
|
Часовой пояс GMT +3, время: 06:35. |