Scroll problems

In this article

Mouse wheel control's scrolling isn't very smooth

We are sorry, but this is the only way the scrolling can work and there are no options to make it smoother. The problem with scrolling is, that there are different mouse scrollers, which are using different amount of scrolls when one mouse scrolling happens. There are even mouse scrollers, which aren't stopping at all. So even if it seems like defining one mouse scroll is simple, it isn't, as one scroll on one mouse could mean two or three scrolls on another and because of this we had to put bigger delays between the actions. This is the only way we can support the scrolling of all mouses we know about.

JavaScript scroll event doesn't work on pages with our slider

This problem can be caused with the combination of the Overflow-X option at the Fullwidth or Fullpage responsive mode, and this CSS code:

html, body {
    height: 100%;
}

Maybe it is enough to just have it on one of these elements. The cause of the issue is, that with the Force full width option we are using JavaScript to calculate the slider's width to be able to go over the website's theme's/template's limitations, and make your slider be as wide as the screen is.

This cannot be pixel perfect, so to avoid horizontal scrollbars, we are putting an overflow-x:hidden; to the element set at the Overflow-X option. This means that if the slider is 1px wider, than your website, that one pixel from the right side won't be visible. Browsers have problems with handling overflows, widths and heights and sometimes these aren't working together as expected. So you should either turn off Overflow-X option, or remove the 100% height from your body and html elements.

Layer animations don't start

When the Play when visible option at Slider settings → Loading is turned on, the slider only starts the layer animations it gets visible. The calculations use JavaScript, which can no longer ask down the slider's position on the page when your theme/page builder sets a 100% height for the body and html elements, such as:

html, body {
    height: 100%;
}

You should use your browser to find out where are these codes located and remove them.

Double scrollbar appears on the website

This problem will be caused by the Overflow-X option, which is related to the Force full width option. The Force full width option is calculating the size of the slider using JavaScript, but that can't be pixel perfect. This is why we put an overflow hidden on the website, when this option is turned on, to avoid horizontal scrollbars. But if you have a CSS code like this in your website:

html, body {
    height: 100%;
}

then browsers are handling this weirdly, causing double scrollbars. So you should either turn off the Overflow-X option, or find the height CSS code and remove it.

Did this answer your question? Thanks for the feedback There was a problem submitting your feedback. Please try again later.