2014-09-26 2 views
3

У меня есть этот топ Navbar:Сделать относительное положение работы как фиксированное положение на Iphone

<div id="nav">My nav</div> 

я держу его фиксированным к началу, используя этот яваскрипт кода:

$(window).scroll(function() { 
    $('#nav').css({ top: $(window).scrollTop() }); 
}) 

У меня есть проблема на моем Iphone потому что, когда я прокручиваю вниз навигацию, и после этого, когда я снимаю палец с сенсорного экрана, навигатор снова появляется.

Я попытался использовать события touchstart, touchmove и touchhend для запуска между фиксированным/относительным положением для моего навигатора, но он все еще не работает правильно. (дело в том, что, когда я не касаюсь экрана пальцем, навигатор должен быть относительным)

Есть ли другой способ устранить эту проблему без использования фиксированной позиции?

+0

Я пробовал это, но эффект не гладкий вообще, он трясет. И еще одна проблема заключается в том, что вы перетаскиваете экран и снимаете палец, пока экран продолжает прокручиваться вниз, что означает, что событие touchmove больше не запускается, и навигатор остается позади. – paulalexandru

+0

Есть ли конкретная причина, по которой вы пытаетесь избежать использования позиции: fixed ;? Я считаю, что я делаю то, что вы пытаетесь выполнить на моем сайте (ShoutDRIVE.com), используя этот метод, и, похоже, он работает довольно плавно на всех платформах. Я попытался бы избежать постоянного обновления верхнего свойства, если это возможно. –

+0

Да, есть причина, по которой я стараюсь избежать фиксированной позиции. Я использую другой плагин, левая боковая панель задвигала страницу в правильном направлении, и у меня есть некоторые проблемы с фиксированным заголовком. – paulalexandru

ответ

0

Ваша навигация исчезает при прокрутке, потому что на сенсорных устройствах она вычисляет только scrollTop, когда вы отпускаете прокрутку. То же самое происходит с js обработанные липкими навигациями. Вы пробовали

position :sticky; 
top:0; 

Я использовал это в качестве запасного варианта для позиции фиксированных/JS позиционирования на Iphone, по той же причине, что и вы.

Смежные вопросы