Question

I am having trouble with the Jquery scrollto command on iphone and ipads, it keeps flickering every time its used and gets stuck so I have decided to remove the code for these devices but am having trouble doing so. Here is the code I am trying to use to only show the javascript on a decktop browser.

<script type="text/javascript"> // <![CDATA[
if ((navigator.userAgent.indexOf('iPhone') != -1) || (navigator.userAgent.indexOf('iPod') != -1) || (navigator.userAgent.indexOf('iPad') != -1)) {
    document.write = "<meta name=\"viewport\" content=width=1024px, minimum-scale=1.0, maximum-scale=1.0 \/>";
}
else{document.write = "<script type=\"text/javascript\">
$(document).ready(function() {$('.nav').onePageNav({begin: function() {console.log('start');}, end: function() {console.log('stop');}, scrollOffset: 30});});
</script>";} // ]]>
</script>

The dev site can be found here: dev.greendealcumbria.com

Cheers

Answer 1

Try this.

var ua = navigator.userAgent.toLowerCase();
if ((ua.indexOf('iphone') != -1) 
     || (ua.indexOf('ipod') != -1) 
     || (ua.indexOf('ipad') != -1)) {
    document.write = "<meta name=\"viewport\" content=width=1024px, minimum-scale=1.0, maximum-scale=1.0 \/>";
}
else{
    $(document).ready(function(){
        $('.nav').onePageNav({
            begin: function() {
                console.log('start');
            }, 
            end: function() {
                console.log('stop');
            }, 
            scrollOffset: 30
        });
    });
}