Показать div при наведении

Question

Показать div при наведении

0

Я хочу показать div как меню при наведении текстового поля, но по какой-то причине он не появляется.

Вот мой css

     .search:hover  #search_drop {
    display:block;
 }


     #search_drop {
        display:none;
        height:500px;
        width:500px;
        background:#000;
        position:absolute;
        top:0px;
     }

вот html

     <div id="navigation_s" style="float:left">
       <ul >
         <li > 
           <div class="search">
             <div id="search_drop"> test </div>
              <form action="" id="searchform">
               <input type="text" name="search" id="searchbox" placeholder="looking for something?"/>
               <input type="submit" id="searchbutton" value="go"/>
              </form>
           </div>
         </li>
       </ul>
     </div>

Все, что я хочу сделать, это навести курсор мыши на поиск #search_drop, который должен отображаться, но это не происходит

CleanX 14 апр. 2014, в 12:39

Источник

3

У меня работает jsfiddle.net/B7m9j
Mr. Alien 14 апр. 2014, в 10:20
0

ваш html неполный, (</ li>) работает нормально, будьте осторожны с html, в каком-то браузере может быть отсутствующий </ li> источник вашей ошибки, попробуйте там jsfiddle.net/RBSFJ
Dimitri 14 апр. 2014, в 10:23
0

И по какой-то причине, если вам нужна какая-либо информация, кроме stackoverflow.com/a/16479686/1542290 мой ответ ....
Mr. Alien 14 апр. 2014, в 10:26
0

используйте javascript onmouseover = "", чтобы вызвать событие, которое переключает видимость ... это позволит вам вызывать его из элемента .search.
JRulle 16 апр. 2014, в 01:46

Показать ещё 2 комментария

Теги:

javascript

html

css

html5

css3

1 ответ

Ещё вопросы

ваш html неполный, (</ li>) работает нормально, будьте осторожны с html, в каком-то браузере может быть отсутствующий </ li> источник вашей ошибки, попробуйте там jsfiddle.net/RBSFJ
И по какой-то причине, если вам нужна какая-либо информация, кроме stackoverflow.com/a/16479686/1542290 мой ответ ....
используйте javascript onmouseover = "", чтобы вызвать событие, которое переключает видимость ... это позволит вам вызывать его из элемента .search.

vivek_nk · Answer 1 · 2014-04-14T09-12-00.000Z

Вы не можете навешивать на не отображаемый узел. display:none → Это не на вашей странице. Таким образом, вы не можете нависнуть над этим. то же относится и к скрытому. Но мы можем изменить другие свойства. Например,

#search {
 border : 1px green solid;
}
#search:hover {
 border : 5px red solid;
}

<div id="search">
abcdefgh
abcdefgh
abcdefgh
</div>