一页网页滚动在iPhone中粘贴

时间:2012-10-30 11:17:02

标签: jquery iphone html5 scroll

我正在开发一个包含HTML5,CSS3和jQuery的单页滚动(垂直)网站。它在PC或Android手机上运行良好。这是一个响应式设计。我在iphone面临问题。如果我单击顶部的菜单,它会滚动到该位置。但是,如果我然后触摸将页面滑动到另一个位置,它将返回到先前的位置。就像它粘在那个位置上一样。单击菜单始终有效,但触摸滚动不起作用。我没有在ipad上查看它。我也在使用航点。
这是我的html导航代码:

<nav>
    <ul>
        <li><a href="#why-us" title="Why us">Why us</a></li>
        <li><a href="#how-we-do-it" title="How we do it">How we do it</a></li>
        <li><a href="#what-we-do" title="What we do">What we do</a></li>
        <li><a href="#workshops" title="Workshops">Workshops</a></li>
        <li><a href="#contact" title="Contact">Contact</a></li>
    </ul>
</nav>


这是我的jquery滚动脚本:

// SCROLLING NAVIGATION
    $('nav ul li a, a#logo').bind('click',function(event){
        $('nav ul li a').removeClass("active-nav");
        $(this).addClass("active-nav");
        var $anchor = $(this);

        $('html, body').stop().animate({
            scrollTop: $($anchor.attr('href')).offset().top
        }, 1500,'easeInOutExpo', function(){
            $('nav#mobile-nav').slideUp();
        });
        event.preventDefault();
    });

    // WAYPOINTS
    var sections = $("div.eachContainer");
    var navigation_links = $("nav ul li a");

    sections.waypoint({
        handler: function(event, direction) {

            var active_section;
            active_section = $(this);
            if (direction === "up") active_section = active_section.prev();

            var active_link = $('nav a[href="#' + active_section.attr("id") + '"]');
            navigation_links.removeClass("active-nav");
            active_link.addClass("active-nav");
            if(active_section.attr("id") == "why-us"){

            }
        },
        offset: '25%'
    });

任何人都可以给我一个解决方案吗?出于某种原因,我不能给你我的网站的URL。感谢。

0 个答案:

没有答案