при наведении курсора на скрытый div - PullRequest
Новая
       6

при наведении курсора на скрытый div

1 голос
/ 09 июля 2011 
<script>
$("#menu-item-58").mouseover(function() { $("#simple_sidenav-3").css('visibility','visible'); });
$("#menu-item-58").mouseout(function() { $("#simple_sidenav-3").css('visibility','hidden'); });
</script>

#simple_sidenav-3 {
    visibility:hidden;
}

simple_sidenav-3 - это скрытый div. Так почему же он не отображается, когда мышь находится над # menu-item-58?

Пожалуйста, проверьте это здесь http://mentor.com.tr/wp/?page_id=164

Ответы [ 3 ]

3 голосов
/ 09 июля 2011

попробуйте вместо этого: 

jQuery("#menu-item-58").mouseover(function() { 
  jQuery("#simple_sidenav-3").css('visibility','visible'); 
});

$ не определено.

2 голосов
/ 09 июля 2011

Вы не завернули свой код в функцию JQuery DOM ready.Поместите это между вашими <script> тегами: 

$(document).ready(function()
{
    $("#menu-item-58").mouseover(function() { $("#simple_sidenav-3").css('visibility','visible'); });
    $("#menu-item-58").mouseout(function() { $("#simple_sidenav-3").css('visibility','hidden'); });
}

Это свяжет события мыши с элементами, когда документ (страница) был загружен.

0 голосов
/ 09 июля 2011

Попробуйте изменить #simple_sidenav-3 с visibility:hidden; на display:none; Затем вызовите что-то вроде .slideDown() для приятного эффекта.

Также вот некоторые улучшения в вашем коде: 

jQuery(function() { //waits till the document is ready
    jQuery("#menu-item-58").mouseover(function () {
        jQuery("#simple_sidenav-3").slideDown();
    }).mouseout(function () {  //no need to use $("#menu-item-58") twice
        jQuery("#simple_sidenav-3").slideUp();
    });
});
...