Главная » 2013 » Август » 11 » Создаём раздвижную форму поиска для uCoz
14:14
Создаём раздвижную форму поиска для 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.

Спасибо за внимание!
Просмотров: 163 | Добавил: DoG | Рейтинг: 0.0/0
Всего комментариев: 221 2 3 »
1 Анастасия  
0
Сотрудничество, Анастасия

Здравствуйте! Меня зовут Анастасия. Извините, что не совсем по теме)
Я не бот, просто листала ваш сайт и решила сделать для вас что-то хорошее)

Мы привозим автомобили из Германии в Россию. Завозим большими партиями.
Вот наш сайт: avtotrade-russia.ru
Telegram: t.me/avto_europe

До 5% наших клиентов отказываются от авто по разным причинам, внеся до 50% стоимости. На такие авто мы оперативно ищем новых заказчиков, цена получается невероятно выгодной! Раньше перепродавали кому-то из компании, сейчас объёмы выросли, ищем новые рынки сбыта.
Периодически публикуем варианты по выгодной цене в нашем telegram. Там есть и мой контакт – t.me/avto_europe

С уважением к вам.

2 BrandonZophy  
0
A/c systems play a pivotal duty in maintaining convenience degrees within homes and industrial spaces. They guarantee a managed temperature level, specifically during extreme climate condition. Nonetheless, these systems are prone to malfunctions and require normal maintenance to run efficiently. This short article explores numerous aspects of air conditioning solutions, covering repair work, installment, upkeep, and typical problems faced by customers. While do it yourself fixes might seem probable, specialist heating and cooling services supply knowledge and assurance of proper repairs. Trained technicians can detect problems accurately and offer thorough solutions, ensuring the system's optimum performance.
<a href=https://fixmyacnj.com/services/hvac/furnaces/furnace-replacement/>trane furnace blower motor replacement</a>

3 Владислав  
0
Меня зовут Владислав из компании Web Hero. Мы обнаружили технические недочеты на вашем сайте, которые могут стать причиной ухода клиентов.
Наша команда готова оперативно устранить эти проблемы и гарантировать бесперебойную работу вашего сайта.

Давайте обсудим, как мы можем помочь. Оставьте заявку на нашем сайте: wbhr.ru или свяжитесь со мной по sale.tp1@wbhr.ru.

С уважением, Владислав.

4 JoaquinNuh  
0
Prior to a Nuru massage therapy session, it's vital to connect preferences and any wellness concerns with the masseuse. Being emotionally and literally prepared improves the general experience.

Appreciating borders and preserving a comfortable environment is essential during a Nuru massage session. Communication and mutual understanding between the masseuse and recipient are key elements.. Selecting a respectable and qualified health facility or masseuse is important to ensure a risk-free and enjoyable Nuru massage therapy experience.

How do I locate a reliable Nuru massage service provider? Researching and choosing licensed health clubs or masseuses with favorable evaluations and adherence to safety and security and ethical requirements is essential.
<b><a href=https://nude.manhattan-massage.com>nude massage price</a></b>

5 Артём  
0
Получите клиентов с сайтов ваших конкурентов за 1 день с гарантией результата!
Современные инструменты BigData позволяют узнать кто посещал сайты конкурентов или звонил им на телефон, чтобы работать именно с этой горячей аудиторией в режиме реального времени
лиды от 25 рублей. можем предоставить под прозвон от 25 руб или разослать SMS/MMS/Viber от 3,6руб (только РФ)
Любые законные ниши, торговля, услуги, привлечение работников,агентов, B2B, B2C.
100% легальный метод, никакие законы не нарушаем.
Доступная цена. договор. закрывающие документы.
также в наличии базы данных компаний под B2B
наш cайт https://bigdata.popupbiz.ru оставьте заявку и бонусом получите софт для whatsapp-рассылки или email-рассылки
телеграм канал @bigdatapopupbizru
email bigdatabiz@mail.ru
89529082087

6 Анастасия  
0
Перехватим клиентов с сайтов конкурентов. Ноу-Хау в привлечение клиентов.
Современные инструменты BigData позволяют узнать кто посещал сайты конкурентов или звонил им на телефон, чтобы работать именно с этой горячей аудиторией в режиме реального времени
контакты от 17 рублей. можем предоставить под обзвон от 17 руб или разослать SMS/ MMS/ Viber от 3,6 руб (только РФ)
звонки посетителям сайтов конкурентов в реальном времени, в течение 20 минут с момента посещения сайта или звонка конкуренту, по самой горячей аудитории.
Любые законные ниши, торговля, услуги, строительство, привлечение работников, агентов, B2B, B2C и т.д.
100% легальный метод, никакие законы не нарушаем.
Доступная цена. договор. закрывающие документы.
также можем добыть базы клиентов компаний под B2B
наш cайт https://bigdata.popupbiz.ru оставьте заявку
телеграм канал @bigdatapopupbizru
email bigdatabiz@mail.ru
89529082087

7 Виктор  
0
Займы для бизнеса без банков от частных и юр. лиц под разумный процент по двум документов за сутки.
Решение за 3 минуты по 2 документам: паспорту и выписке по счёту. Деньги зачисляются на ваш расчётный счёт.
Пока вы ими не пользуетесь, ничего платить не нужно.
Есть вопросы? Обратитесь к своему менеджеру – расскажем все подробности и пришлем презентацию и все необходимые документы!

Виктор
nobldecor@mail.ru почта
+79231069528 телефон для связи
https://wa.me/79231069528 вотсап
https://t.me/jetlends телеграм

1. Предлагаем вариант оформления возобновл. кредитной линии до 24 мес., сумму до 18 млн. руб, для новых клиентов и срок до 48 мес и сумму до 56,5 млн р для повторных клиентов.
2. Размер процентной ставки зависит от рейтинга организации, начинается от 18,4%
3. Кредитный лимит предоставляется без залога, страховок и дополнительных финансовых ковенант. Поручительство – в некоторых случаях.
4. Для получения решения нужны всего 2 документа: паспорта бенефициаров, и выписка по расчетному счету (-ам) за 12-24 месяца в формате txt из банк-клиента.
5. Информация по сумме одобренного лимита не отражается в БКИ, только сумма транша- по факту пользования лимитом.
6. Берете транш в той сумме, которая необходима Вам. Берете тогда, когда вам потребуются срочно деньги.

8 SerjType  
0
<a href=https://pornopda.xyz/virt/sexcard/33104-seks-industrija-kak-tehnologii-perevernuli-nashu-koncepciju-o-sekse-i-ljubvi-telefony-devushki-pozvonit-seks-virt-ne-dorogo-po-programmam-prilozhenijam-s-kamerami.html>Молодая чувственная женщина хочет испытать бабочки в животе во время флирта milf phone sex с опытными девочками</a> в исполнении наших профессиональных партнёров? Это возможность разговаривать с настоящими экспертами в сфере интимных удовольствий, которые воплотят все ваши фантазии в жизнь и помогут вам испытать волнующие ощущения, не выходя из дома.
<b>Русски порно мама сын разговор телефон : <a href="tel:+78095056850">+7-809-505-6850</a>. Можно позвонить с мобильного и городского телефона, а также заказать </b> <a href=https://pornopda.xyz/virt/sexcard/>предоплату.</a>

Если вы хотите испытать сексуальное удовольствие и тайные желания, но не готовы или не желаете включать в игру реальных партнёров, наш сервис идеально подходит для вас. Мы предлагаем полное конфиденциальность и анонимность, так что вы можете откровенно выражать свои фантазии, не ограничивая себя никакими правилами и стереотипами.
Раскройте свои самые сокровенные фантазии с помощью нашего мобильного эротического центра <b> <a href=https://pornopda.xyz/virt/sexcard/33060-skajp-i-vebkamera-novaja-forma-virtualnyh-znakomstv-i-vzaimnoj-masturbacii-virt-po-telefonu-zrelye-mamochki-nauchat-tebja-novomu.html>Секс по телефону объявления молодых девушек Москвы</a> </b> ! Исследуйте сокровищницу соблазнительных фотографий и видео, а также заманчивую подборку секс-игрушек и виртуальных впечатлений. Погрузитесь в желание сегодня! Как это работает? Все очень просто! Позвоните на наш телефонный номер, предоставленный на нашем сайте, и выберите партнёра для бесплатного сексуального разговора. У нас широкий выбор опытных профессионалов, которые готовы выполнить любые ваши желания: от романтической беседы о сексе до экспериментов с ролевыми играми.
Наши партнёры обладают высоким уровнем эрудиции и коммуникативных навыков, они поддержат любую тему разговора, настроят вас на волнующую волну и окунут вас в мир сексуальных фантазий. Они готовы выслушать вас, поделиться своими опытом <b> <a href=https://pornopda.xyz/pornofoto/ero-foto/14015-jeroticheskie-fotografii-molodenkoj-modeli-kjeti.html>Молоденькая Лоретта колготки, фото в красивом белье</a> </b> и помочь раскрыть новые стороны ваших эротических предпочтений.
Поднимите свои интимные моменты с нашим эротическим раем на вашем телефоне! Погрузитесь в страсть благодаря нашему увлекательному контенту и купите самые модные игрушки. Готовы воплотить свои фантазии в реальность? Это всего лишь прикосновение.

Посетите нас сейчас!

9 Территория  
0
Здравствуйте! Я представляю команду разработки и внедрения Национальной Системы «Территория» (https://территория.рус). Официальный запуск системы запланирован на июль, но уже сейчас мы можем в частном порядке предоставлять ранний доступ для компаний/сообществ, а также выстраивать сотрудничество на перспективу.

Система Территория уже официально внедряется на 5 территориях на Кавказе с общим пропуском до 3 миллионов гостей в год. Также, в этом году будет подключено ещё не менее 8 территорий с очень высоким потоком гостей. Общий потенциал аудитории в 2024 году составит более 3 миллионов человек.

Что будет доступно:
- Создание компании/сообщества в системе до официального открытия такой возможности.
- Лента новостей, галерея, документы и другие инструменты для организаций.
- Нахождение в публичном списке организаций до запуска системы.
- Возможность приобретения рекламных кредитов по цене от 10% стоимости на открытии.
- Постоянная скидка до 50% на рекламные кредиты.
- Различные привилегии раннего доступа.
- Высокая репутация ранних пользователей.
- Ранний доступ к другим продуктам.
- Прямая поддержка разработчиков в интеграции.

Просим отнестись с пониманием к вопросу ограниченого количества документации. Постепенно эта проблема будет решена.

Предложение ограничено физическими возможностями команды. На ранний доступ принимаем не более 100 компаний.

Это сообщение вам отправлено, чтобы выявить интерес к сотрудничесту. Если вам интересно предложение и вы готовы рассмотреть сотрудничество — напишите нам на email territory@anksystems.ru и мы с вами свяжемся.

10 Положительный отзыв  
0
Мы предлагаем услуги по написание и размещение положительных отзывов про Вас в интернете!!!

Работаем с самыми популярными площадками:
yandex.ru, google.ru, zoon.ru, yell.ru, otzyvru.com, ru.otzyv.com, 2gis.ru, hh.ru, pravda-sotrudnikov, spr.ru и многик другие.

Сайт https://otzyvtop.creatium.site/
Тел. 985-882-26-76
E-mail otzyv.top10@gmail.com

1-10 11-20 21-22
Имя *:
Email *:
Код *: