Суббота, 19.07.2025, 09:07
Меню сайта
    Форма входа
    Категории раздела
    скрипты для ucoz сайта [3099]
    шаблоны для ucoz скачать [2660]
    Иконки групп для форума [25]
    Графика для сайта [1953]
    шаблоны psd для фотошопа [27]
    кисти для фотошопа [39]
    уроки фотошопа на русском языке [4]
    стили для фотошопа [3]
    шрифты для фотошопа cs4 [12]
    Web-master [3058]
    Поиск
    Календарь
    «  Май 2009  »
    Пн Вт Ср Чт Пт Сб Вс
        123
    45678910
    11121314151617
    18192021222324
    25262728293031
    Архив записей
    Наш опрос
    Умеете ли вы писать скрипты для ucoz?
    Всего ответов: 73
    Мини-чат
    200
    Друзья сайта
  • Официальный блог
  • Сообщество uCoz
  • FAQ по системе
  • Инструкции для uCoz
  • Статистика

    Онлайн всего: 1
    Гостей: 1
    Пользователей: 0
    Главная » 2009 » Май » 26 » Закругление краёв на jQuery!
    19:38
    Закругление краёв на jQuery!
    Делаем блок с закруглёнными краями, при помощи jQuery

    это в head

    Code
    <script src="http://ms-studio.do.am/file/JS/blok.js" language="javascript"></script>
    <script src="http://ms-studio.do.am/file/JS/1.js" language="javascript"></script>

    Это в CSS

    Code
    body{padding: 0px 0 0;background:#FFF;
      font: 100.01%/1.3 Verdana,Arial,}
    div#box{width: 30em;padding: 15px;margin:0 auto;
      background:#E6E6E6;color:#000}
    h1{font: lighter 200% "Trebuchet MS",Arial sans-serif;color: #208BE1}
    h1,p{margin:0;padding:10px 20px}
    /*Nifty Corners Cube CSS by Alessandro Fulciniti
    The following classes are added dinamically by javascript,
    and their use should be avoided in the markup */

    b.niftycorners,b.niftyfill{display:block}
    b.niftycorners *{display:block;height: 1px;line-height:1px;font-size: 1px;
      overflow:hidden;border-style:solid;border-width: 0 1px}
    /*normal*/
    b.r1{margin: 0 3px;border-width: 0 2px}
    b.r2{margin: 0 2px}
    b.r3{margin: 0 1px}
    b.r4{height: 2px}
    b.rb1{margin: 0 8px;border-width:0 2px}
    b.rb2{margin: 0 6px;border-width:0 2px}
    b.rb3{margin: 0 5px}
    b.rb4{margin: 0 4px}
    b.rb5{margin: 0 3px}
    b.rb6{margin: 0 2px}
    b.rb7{margin: 0 1px;height:2px}
    b.rb8{margin: 0;height:2px}
    b.rs1{margin: 0 1px}
    /*transparent inside*/
    b.t1{border-width: 0 5px}
    b.t2{border-width: 0 3px}
    b.t3{border-width: 0 2px}
    b.t4{height: 2px}
    b.tb1{border-width: 0 10px}
    b.tb2{border-width: 0 8px}
    b.tb3{border-width: 0 6px}
    b.tb4{border-width: 0 5px}
    b.tb5{border-width: 0 4px}
    b.tb6{border-width: 0 3px}
    b.tb7{border-width: 0 2px;height:2px}
    b.tb8{border-width: 0 1px;height:2px}
    b.ts1{border-width: 0 2px}

    Если рабрираетесь то можете поизменять CSS
    Если же не то вот в этой строчке меняеться размер блока
    div#box{width: 30em;padding: 15px;margin:0 auto;

    Самп же блок прописываеться так

    Code
    <div id="box">
    <h1>Заголовок</h1>


    lt;p>Текст</p>
    </div>

    Вот ПРИМЕР!

    Автор Alessandro Fulciniti biggrin
    Всё удачи

    Категория: скрипты для ucoz сайта | Просмотров: 680 | Добавил: -=FoX=- | Рейтинг: 0.0/0
    Всего комментариев: 5
    5 nikit13  
    0
    ха.... прикольно хороший скрип!!

    2 Vadim  
    0
    На чём-чём?

    3 -=FoX=-  
    0
    написанно было на jquery
    Я просто JS файлы подписал произвольно, у меня в примере скрипт был в head , я просто подкоректировал для удобства и выложил smile

    4 -=FoX=-  
    0
    а да biggrin написал неправильно xD не JQuery а jQwery

    1 -=FoX=-  
    0
    и это не CSS 3, поэтому будет отоброжаться наверно во всех браузерах )

    и перед текст пропустил тег <P> ) ...одишете ...


    Добавлять комментарии могут только зарегистрированные пользователи.
    [ Регистрация | Вход ]