serovpochta
@serovpochta
Лысый

Выкатывающаяся форма поиска, загвоздка с задачами в style.css?

Никак не получается создать форме поиска меню в style задачу правильного отклика на клик мыши: cg91812-wordpress-3.tw1.ru
Нужно только при нажатии на оранжевый квадрат открывать поиск, и после клика перед вводом текста сохранять стиль формы открытой, а при отводе мыши строка снова прячется собака
Замученный стайл..не пойму где конфлик:
/* MENU SEARSH */
.menu-item-search {
    position: absolute;
    width: 50px;
    height: 50px;
    opacity: .71;
  -moz-transition: width 180ms;
  -o-transition: width 180ms;
  -webkit-transition: width 180ms;
	transition: width 180ms;}

@media screen and (max-width: 892px) {
.menu-item-search {
    display: none;}}
.menu-item-search:hover {
    width: 626px;
    opacity: 1;}

.my-wp-search {
    width: 50px;
    height: 50px;}

#s {
background :#d3d6c3;
color: #f0522b;
height: 50px;
width: 626px;
border: 6px solid #f0522b;}

#s:focus {
background :#fff;
width: 100%;
opacity: 1;}

#searchsubmit {
cursor: pointer;
width: 50px;
height: 50px;
margin: 0 0 0 -50px;
background: #f0522b;
font-style: normal;
font-size:16px;}

.menu-header li:last-child{padding:0px 0px;}
.menu-header li:last-child:hover{padding:0px 0px;}
.menu-header li:nth-last-child(2) {margin-right: 53px!important;}
.menu-item-search {position: absolute!important; top: 0; right: 0;}
/* MENU SEARSH */

через function.php:
// menu-search-form.
function add_search_to_wp_menu ( $items, $args ) {
 if( 'primary' === $args -> theme_location ) {
$items .= '<li class="menu-item menu-item-search">';
$items .= '<form method="get" class="menu-search-form" action="' . get_bloginfo('home') . '/"><p><input class="text" type="text" value="Поиск по сайту" name="s" id="s" onfocus="if (this.value == \'Поиск по сайту\') {this.value = \'\';}" onblur="if (this.value == \'\') {this.value = \'Поиск по сайту\';}" /><input type="submit" class="my-wp-search" id="searchsubmit" value="+"/></p></form>';
$items .= '</li>';
 }
return $items;
}
add_filter('wp_nav_menu_items','add_search_to_wp_menu',10,2);
  • Вопрос задан
  • 313 просмотров
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы