Скрыть меню (div), когда перекрывает другие элементы при прокрутке - PullRequest
0 голосов
/ 18 октября 2011

У меня небольшая проблема с jquery и меню div, которое не скрывается правильно!

У меня есть одностраничный сайт с фиксированным меню в верхней части окна просмотра, которое следует за окном, в то время какпользователь прокручивает вниз.Вся навигация похожа на длинную (в зависимости от высоты div) вертикальную прокрутку.

Все содержимое страницы находится в отдельных div, как показано ниже.

<!-- this is the menu-->
<ul id="jmenu" style="position:fixed; z-index:9999">
  <li>...</li>
  <li>...</li>
</ul>
<!-- this is the structure section-->
<div id="first">...</div>
<div id="second">...</div>
<div id="third">...</div>
<div id="fourth">...</div>

и т. Д.

Я использую этот код jquery и библиотеку jquery-overlap (https://github.com/brandonaaron/jquery-overlaps), чтобы скрыть меню, если оно перекрывает некоторый текст (в данном случае некоторые теги h1)

var over= false;
$(document).scroll((function() {
if($('#jmenu').overlaps("h1") && (over==false)){
    $('#jmenu').fadeOut("slow");
    over= true;
}else{
    $('#jmenu').fadeIn("slow");
    over= false;
}
}));

Но в этом что-то не так. Меню начинает мигать, если я быстро прокручиваю всю страницу, и меню перекрывает много разных h1.

Может кто-нибудь сказать мне, что яя делаю неправильно ???

Ответы [ 3 ]

0 голосов
/ 18 октября 2011

У вас есть опечатка здесь: && (over=true) должно быть && (over==true) или просто && (over)

0 голосов
/ 18 октября 2011

Просто мысль:

Возможно, замирание происходит не так быстро, как прокрутка, поэтому оно запутано.Вы можете попробовать использовать .stop (true, true) .animate (/ ваши свойства здесь /) вместо предварительно встроенной функции fade.Посмотрите .stop () на jquery, это ключ здесь.

Мне нужно было бы увидеть страницу в действии, чтобы определить более точный ответ.

0 голосов
/ 18 октября 2011

Если эта строка;

if($('#jmenu').overlaps("h1") && (over=true)){

Be

if($('#jmenu').overlaps("h1") && (over=false)){
...