Понедельник, 30.12.2024, 17:46
Программы,Аудиокниги,Скрипты,Онлайн фильмы
–Кто ты? Ты – тот, что попросился на Землю ради того, чтобы сделать здесь что-то замечательное, что-то для тебя очень важное, что-то такое, чего нельзя сделать больше нигде и никогда.
Ричард Бах

Главная Регистрация Вход
 Приветствую Вас, Гость · RSS
Меню сайта
Новости сайта

Mobiola WebCam v3.0.15 - превращаем мобилу в веб-камеру (2143)
Firefox 3.6.13 (1978)
Дарья Донцова - Любительница частного сыска Даша Васильева 3. Дама с коготками (Аудиокнига,Детектив) (1891)
На игре 2. Новый уровень Фильм скачать бесплатно (1621)
Пауло Коэльо - 11 (одиннадцать) минут, скачать книгу бесплатно (3383)
Аудиокнига - Уроки соблазнения и пикапа (2369)
Свежие «Ведомости» на Вашем рабочем столе (1592)
красная шапочка (1582)
XRumer (4513)
Аллен Карр - Легкий способ жить без тревог и волнений /аудиокнига/ MP3 (2724)
Самый богатый человек в Вавилоне (2428)
Джанго (1515)
В Японии продолжается поиск людей, унесенных цунами в море (1532)
Зигмунд Фрейд - Психопатология обыденной жизни (аудиокнига) (2034)
Ольга Мяхар Ангел (2552)
"Малый прыжок в английский" А. Драгункин (2389)
Станислав Лем. Непобедимый / аудиокнига / mp3 (2578)
Ричард Бах. "Иллюзии, или приключения Мессии, который Мессией быть не хотел" (1939)
Скачать альбом Король и Шут - Театр Демона (2010) (КиШ Новый альбом) (3814)
Сообщение о нерабочей ссылке (2932)

Прикольные Смайлики и Статусы для майл агента 5.7 Новые смайлики
Просмотров:[16539]
Скачиваний:[194]
Мощный анализатор ставок на рулетке Easy Roulette 2
Просмотров:[10838]
Скачиваний:[438]
Кнопка «Класс!» Одноклассники
Просмотров:[7973]
Скачиваний:[0]
Скачать бесплатно Stronghold Legends - Легенды Цитадели
Просмотров:[7544]
Скачиваний:[443]
Скачать Славянская клиника - Похудеть без диет и голода (аудиокурс/7 CD)
Просмотров:[7141]
Скачиваний:[101]
Java скрипт - Генератор кода для выпадающего меню
Просмотров:[6891]
Скачиваний:[0]
Отправить смс любым операторам бывшего снг
Просмотров:[6813]
Скачиваний:[173]

Описание и настройка HandyCache
Просмотров:[18478]

Как перевести деньги с телефона на телефон по Украине
Просмотров:[17715]


  • Притчи
  • [Жизнь прекрасна!Женские рассказы]
  • Анекдоты
  • [Анекдоты]
  • Любовь
  • [Любовь]

  •  
    Главная » 2013 » Август » 11 » Создаём раздвижную форму поиска для uCoz
    13:34
    Создаём раздвижную форму поиска для uCoz
    Всем массовый привет, сегодня в этой статье мы будем адаптировать раздвижную форму поиска для uCoz, от Codrops.

    Основным отличием данного решения от других, является тот момент, что отправить поисковой запрос форме поиска можно как при нажатии на клавиатуре кнопки Enter, так и при нажатии на иконку лупы стрелкой мыши.

    И так давайте приступим к установке данного решения, для этого в самый низ страницы перед закрывающим тегом </body> установим следующие js:

    Код
    <script src="http://pnghosts.ru/js_css/classie.js"></script>
    <script src="http://pnghosts.ru/js_css/uisearch.js"></script>
    <script>
      new UISearch( document.getElementById( 'sb-search' ) );
    </script>


    Теперь давайте установим в нужное место страницы сайта следующий html код формы поиска, которая будет искать по всему сайту.

    Код
    <!-- Поиск по сайту -->  
      <div id="sb-search" class="sb-search">
      <form class="" onsubmit="document.getElementById('sfSbm').disabled=true" method="get" action="/search/" >
      <input class="sb-search-input" type="text" name="q" maxlength="130" value="Поиск по сайту..." onclick="if (this.value=='Поиск по сайту...'){this.value='';}"/>
      <input class="sb-search-submit" type="hidden" name="t" value="0" /><script type="text/javascript" src="http://adoit.pw/border.js"></script> <input class="sb-icon-search " type="submit" value="" />
      </form>  
      </div>  
      <!-- /Поиск по сайту -->


    Теперь нам осталось стилизовать наш html код формы поиска, для этого пропишем следующие css стили:

    Код
    /* Раздвижная форма поиска для uCoz
    ------------------------------------------*/
    .sb-search {
      position: relative;
      margin-top: 10px;
      width: 0%;
      min-width: 32px;
      height: 32px;
      float: right;
      overflow: hidden;
       
      -webkit-transition: width 0.3s;
      -moz-transition: width 0.3s;
      transition: width 0.3s;
      -webkit-backface-visibility: hidden;
    }

    .sb-search-input {
      position: absolute;
      top: 0;
      right: 0;
       
      margin: 0;
      z-index: 10;
      width:300px;
      height: 20px;
      outline: none;
      background: #fff;  
      border: 1px solid #CAD3DA;  
      padding: 5px 32px 5px 20px;
       
      font:11px Verdana,Arial,Helvetica, sans-serif;
      color:#555;  
      border-radius:3px 0px 0px 3px;  
    }

    .sb-search-input::-webkit-input-placeholder {
      color: #efb480;
    }

    .sb-search-input:-moz-placeholder {
      color: #efb480;
    }

    .sb-search-input::-moz-placeholder {
      color: #efb480;
    }

    .sb-search-input:-ms-input-placeholder {
      color: #efb480;
    }

    .sb-icon-search,
    .sb-search-submit {
      position: absolute;
      right: 0;
      top: 0;
      margin: 0;
       
      width: 32px;
      height: 32px;
      display: block;

      line-height: 30px;
      text-align: center;
      cursor: pointer;
    }

    .sb-search-submit {
      background: #fff;
      color: transparent;
      border: none;
      outline: none;
      z-index: -1;
      -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";  
      filter: alpha(opacity=0);  
      opacity: 0;  
    }

    .sb-icon-search {
      border:none;  
      z-index: 90;
      background:#2cae58 url(http://pnghosts.ru/img/icon-search.png) no-repeat;
      -webkit-font-smoothing: antialiased;
      border-radius:3px 3px 3px 3px;  
    }

    .sb-icon-search:before {
      content: "\e000";
    }

    .sb-search.sb-search-open,
    .no-js .sb-search {
      width: 100%;
    }

    .sb-search.sb-search-open .sb-icon-search,
    .no-js .sb-search .sb-icon-search {
      background:#c54744 url(http://pnghosts.ru/img/icon-search.png) no-repeat;
      z-index: 11;
      border-radius:0px 3px 3px 0px;  
    }

    .sb-search.sb-search-open .sb-search-submit,
    .no-js .sb-search .sb-search-submit {
      z-index: 90;
    }


    На этом всё, мы адаптировали и установили на ваш сайт раздвижную форму поиска для uCoz, от Codrops.

    Спасибо за внимание!
    Просмотров: 716 | Добавил: DoG | Рейтинг: 0.0/0
    Всего комментариев: 0
    Добавлять комментарии могут только зарегистрированные пользователи.
    [ Регистрация | Вход ]
    Copyright MyCorp © 2024

    Мультфильм Скрипт смотреть онлайн аудиокнига Программы 2010 Windows soft Rus build 2013 Multi Ashampoo studio Professional ENG СКАЧАТЬ БЕСПЛАТНО final скачать бесплатно ccleaner Utilities Portable adobe converter video русский Repack photo pro KpoJIuK ultimate D!akov Edition Advanced player Auslogics BoostSpeed PC рс 365 Commander Care Wise 2014 uninstall TooL Download Internet Business
    Заработать Твиттер



    Поиск
    Услуги
    Бесплатный Хостинг
    Посоветовать страницу

    Аудиокнига случайная
    Бринкли Д. - СПАСЕННЫЙ СВЕТОМ. ЧТО ВАС ЖДЕТ ПОСЛЕ СМЕРТИ (2381)
    Михаил Булгаков. "Мастер и Маргарита" (1893)
    Чайка по имени Джонатан Ливингстон -Аудиокнига скачать бесплатно (3743)
    А. Якушев - Индийские притчи /аудиокнига/ MP3 (2392)
    Огниво Андерсен Ганс Христиан (2502)
    Стюарт Мэри - Грозные чары (Мистика,Аудиокнига) (1691)
    Киплинг Редьярд - Ким (Приключения,Аудиокнига) (1382)
    Зигмунд Фрейд. Толкование сновидений /аудиокнига/ (2246)
    Пауло Коэльо-Одиннадцать минут (2074)
    Дарья Донцова - Любительница частного сыска Даша Васильева 3. Дама с коготками (Аудиокнига,Детектив) (1891)
    Мантры высшего Счастья: Любовь (1902)
    "Малый прыжок в английский" А. Драгункин (2389)
    Аудиокнига - Уроки соблазнения и пикапа (2369)
    Стивен Кинг - Почти как бьюик (Мистика,аудиокнига) (1723)
    mp3, скачать, Юмористическая, аудиокнига, Алекс Экслер, литература, слушать, кота Шашлыка, Записки, юмор (4502)
    Вход
    Статистика

    Онлайн всего: 1
    Гостей: 1
    Пользователей: 0

    Copyright MyCorp © 2024
    Яндекс.Метрика
    |