Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Remove style superContainer from CSS #2812

Closed
lsterling03 opened this issue Jul 24, 2017 · 5 comments
Closed

Remove style superContainer from CSS #2812

lsterling03 opened this issue Jul 24, 2017 · 5 comments

Comments

@lsterling03
Copy link

lsterling03 commented Jul 24, 2017

What is the reason for adding touch-action:none to the fullpage.js container? Touch scrolling does not work on Android chrome or firefox on my site, but I can fix it if I remove touch-action:none from the fullpage.js css. -OR- I can also fix it if I remove the responsive options from my fullpage.js settings. It just doesn't work if I have both responsive options AND touch-action:none.

I assume touch-action:none must be there for a reason, so I'm afraid to remove it. But I'm not sure how else to fix the scrolling issue on Android because I need the responsive declaration.

Here are my fullpage.js settings. Is there something here that is incompatible with mobile scrolling?

$('#superContainer').fullpage({
	menu: '#sidenav .nav',
	scrollBar: true,
	lockAnchors: false,
	scrollingSpeed: 1000,
	responsiveWidth: 992,
	responsiveHeight: 700,
	slidesNavigation: true,
	fitToSection: true,
	fitToSectionDelay: 500,
	afterRender: function() { 

	  // preloader
	  setTimeout(function() {
		  //video.addEventListener("canplay", function() {
			$('body').addClass('loaded');
		  // }, false);
	  }, 800);

	}
});

I am using the latest version of fullpage.js from cdnjs.

@alvarotrigo
Copy link
Owner

Touch scrolling does not work on Android chrome or firefox on my site

Does the demo page scrolls correctly on your device?

If so, does the normal scroll demo scrolls correctly on your device?

@lsterling03
Copy link
Author

Scrolling does work properly on the demos. However, I noticed the one difference is that my fullpage wrapper was id="superContainer". That was what was applying the mobile-touch styles to the wrapper. When I switched the id to "fullPage", then it worked fine. What is the deal with using superContainer?

@alvarotrigo
Copy link
Owner

When I switched the id to "fullPage", then it worked fine. What is the deal with using superContainer?

Interesting... the CSS file has superContainer defined in it. That's probably from a super old version of fullpage.js and needs to be removed.

I'll mark it as an enhancement. Thanks for reporting it.

@alvarotrigo alvarotrigo changed the title No touch scrolling on Android (touch-action:none) Remove style superContainer from CSS Jul 28, 2017
@lsterling03
Copy link
Author

Awesome. Thanks!

@alvarotrigo
Copy link
Owner

alvarotrigo commented Oct 11, 2017

Fixed on the dev branch 2.9.5

fynncfchen pushed a commit to fynncfchen/fullPage.js that referenced this issue Oct 14, 2017
fynncfchen pushed a commit to fynncfchen/fullPage.js that referenced this issue Oct 15, 2017
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

No branches or pull requests

2 participants