Revolution Slider jumping on load

ki_admin · October 28, 2020, 9:20am

Hi,
I am having an issue with revolution slider. I have a bunch of full screen sliders on my pages, and they all do a jump upwards of maybe 50-100px after loading. I did not have this problem when the slider was just set to full width, but that looked horrible on iPad, hence I had to change it. You can see the jump here: https://ki.dk/en/industry/

Any ideas as to how I can fix this? Thanks!

tristup · October 28, 2020, 1:55pm

Hi @ki_admin,

Thanks for reaching out.
The given credentials are not working, and after an unsuccessful login, your site start showing the 406 Security Incident Detected error.
Can you please check once the credentials and send it again.

Thanks

ki_admin · October 28, 2020, 2:06pm

Hmm very odd. I will try resetting the password.

christian · October 28, 2020, 5:16pm

Hey @ki_admin,

Regretfully, if the slider is Fullscreen, it will add another step in the process of displaying the slider and that is to calculate the position of layers.

I’d like to test some more but your site is live and what I’m going to do will disrupt your site’s operation and because caching is enabled in your site, it delays our testing. If you could copy your site to a staging server, we can do some more tests. Give us the staging credentials like you did the live site.

Otherwise, you need to use Fullwidth layout and we’ll check the layout problem you’re referring to and see if that is easier to diagnose than the position shift issue.

Thanks.

ki_admin · October 29, 2020, 9:32am

Hi Christian,

The site isn’t officially in use yet (we are changing our company name, so until that happens, noone is visiting).

I tried turning off parallax on one of the sliders, and that fixed the jumping issue, but I think it would be a shame if I have to turn it off everywhere on the site.

tristup · October 29, 2020, 9:43am

Hi @ki_admin,

It’s great that it resolve for now. But please let us know once your site is ready to check, so we can start investigating the issue with Slider Revolution and the parallax effect.

Thanks

ki_admin · October 29, 2020, 10:01am

Hi again,

The site is ready to check. It is definitely the parallax effect causing the issue. Is there a way to fix this so it doesn’t jump, or do I have to turn it off everywhere?

christian · October 29, 2020, 10:19am

Hey @ki_admin,

We will report this issue to ThemePunch, the Slider Revolution author. For now, please either use the Fullwidth Layout or disable the parallax as both features require calculating the layer position.

Thanks.

ki_admin · October 29, 2020, 11:10am

Hi again,

I turned off parallax on this slider: https://ki.dk/industri/

But now the image is no longer centered vertically as it is supposed to and I cannot figure out how to fix it. I tried setting it centered to both layer and scene, but it looks the same. Any ideas? With parallax turned on it at least jumped to the right position in the end…

tristup · October 29, 2020, 1:07pm

Hi @ki_admin,

The image is aligned vertically centered, but as the very next section having the same background color, it creates confusion. I have set the background color of the section through the Browser debugger tool and found its fine. Please find the screenshot explaining it.

Thanks

ki_admin · October 30, 2020, 8:33am

Okay, so I now see that the issue is, that the slider’s height is set to full-screen, but it is then pushed under the navigation bar. Is there a way to subtract the header’s height from the slider?

tristup · October 30, 2020, 9:21am

Hi @ki_admin,

Section padding and margin are set to the 0 that might be the reason for your issue. I would suggest you back to the preset value for these attributes and check if the issue still exists or not.

Thanks

ki_admin · October 30, 2020, 9:59am

I tried, but padding and margin on the section makes no difference to the slider as far as I can tell.

tristup · October 30, 2020, 10:20am

Hi @ki_admin,

I found that the padding and margin value is affecting the output. Can you please check by clearing your browser cache and check it again?

Thanks

ki_admin · October 30, 2020, 10:42am

Okay, I see now that the padding is being added. However this in no way helps towards solving the problem. It only pushes the image down further

tristup · October 30, 2020, 11:09am

Hi @ki_admin,

The preset value is actually putting the image with the proper padding and margin whereas your value was overridden the preset value and that was the cause of the issue you were having.

Thanks

ki_admin · October 30, 2020, 11:12am

I thought the preset was 45px padding top and bottom? What is the preset then? Could you just set it to whatever you are making work and save so that I can actually see it?

tristup · October 30, 2020, 12:09pm

Hi @ki_admin,

The preset value was 45px padding for top and bottom, and previously your value was 0px which was making the difference. If you are still getting the same issue please let us know.

Thanks for understanding.

ki_admin · October 30, 2020, 1:30pm

I’m not sure we are trying to accomplish the same thing here So just to be clear: I want the slider to take up the whole screen excluding the navbar, and I then want the image to be placed in the vertical and horizontal center.

Right now the slider is simply taking up more space than it should. Adding padding to the section is only making the issue worse.

prakash_s · October 30, 2020, 2:18pm

Hello @ki_admin,

To get the slider Full-width you need to set the Revolution slider size as full width. Go to Slider -->Layout--> Sizing -->Set Full Width.

Screenshot

Thanks