Search code examples
jqueryjquery-mobilejquery-pluginsfullpage.jsslimscroll

fullpage.js mobile scroll not working


I'm currently unable to get the scrolling working on mobile devices for my website using fullpage.js.

On desktop it works absolutely fine, and if I use the chrome emulator, but on mobile the site isn't working too well (filter buttons work really slow). The left and right buttons to change slides are a bit buggy but I can live with that. However, if i try and scroll on the menu page it just doesn't seem to work.

I've imported slimscroll and jquery UI in the correct order, and have scroll overflow set to true so I'm a bit confused why it isn't working on mobile. I've tried using iphone's 4 and 5 but no luck.

the URL is iglouu.co.uk/new

any ideas would really be appreciated!

thanks


Solution

  • You are not initializing the plugin correctly.

    Your HTML mark-up looks like this:

    <div id="wrapper" class="fullpage-wrapper">
        <div id="fullpage">
            <div class="section">
                <div class="slide"></div>
                <div class="slide"></div>
                <div class="slide"></div>
            </div>
        </div>
    </div>
    

    So you should use the id fullpage to initialize the plugin, and not wrapper as you are using now.

    It should be:

    $('#fullpage').fullpage({
       //...
    });
    

    And you have:

    $('#wrapper').fullpage({
       //...
    });