Website not scrolling on some iphones

Hello, my website is getting stuck on some iphones and will not scroll. Could anyone please help and tell me what is the problem. Here is the website…

It’s working on my iphone 5 but is very ‘janky’ due to the nicescroll plugin you are using which is also throwing in a horrible horizontal scrollbar.

I see that your script is adding overflow:hidden to the body which means it is hiding all the overflow and at the same time you have set html,body{height:100%}. Normally the height:100% would not impact the layout other than allowing a height of 100% to be used but once you add overflow:hidden the overflow should be hidden and not visible as it normally would be.

I would suggest you try removing the height:100% and instead use min-height:100vh and then see if that makes a difference. It may have no impact but I can’t really debug any better than that because it is actually working on my old iphone5s (albeit very janky to use).

I dislike those scrollbar plugins as they are always awkward to use and to implement and invariably break in some browser. Not to mention if JS is turned off you won’t be be able to scroll at all!!.

You could just colour the scrollbar for Chrome as CSS tricks does.

Thankyou, may I ask how do I remove the Nicescroll Plugin?

For a start you would remove this script (which is at the bottom of the page):

<script src="js/jquery.nicescroll.min.js"></script>

Then you’d need to remove any specific css that the script required. You should be able to find exactly what’s been added in the documentation for the plugin so you will need to check but the main thing is to remove the overflow-y:hidden from the body tag in your style.css

body {
	/* overflow-y: hidden; */
	letter-spacing: .04em;
	word-spacing: .1em;
	font-size: 18px;
	line-height: 2.3em;

That may indeed be all that’s needed but its hard to tell from here :slight_smile:

Thankyou, I deleted the nicescroll and the problem is now solved. Thankyou.

1 Like

This topic was automatically closed 91 days after the last reply. New replies are no longer allowed.