[Resolved] Image Slider in Viewport (Hero Mode)

[Alex]

I’m currently using LayerSlider but sort of moving away from it and trying to pair my projects with RoyalSlider.
Now the LayerSlider is working in full width hero mode through the elements hook in before_main_content position and looks OK. You may see it in 3 project pages.

Also I’ve set up a test page with RoyalSlider (link provided). The problem is that the slider box gets to the right side of the page and goes below the viewport. The plugin’s author suggests to use the following code:

.royalSlider {
position: absolute;
left: 0;
top: 0;
right: 0;
bottom: 0;
height: auto;
width: auto;
}
The slider perfectly fits the page but the site header and footer are gone.

Is there a way to make it work fine with some extra CSS editing of the GP theme or should I keep bothering the plugin’s support?

[Tom]

Hi there,

Is this something I can see on the page you linked to? I’m not seeing any issues at the moment.

Let me know 🙂

[Alex]

Hi Tom! These two screenshots 1 and 2 show the viewport area of the royalslider installed on one of the test pages I linked to. The problem is that the slider is aligned to right side of the screen and goes beyond the viewport area. I wonder if that can be fixed within the theme?

[Leo]

That’s not something the theme can fix unfortunately as the content container is normal:
https://www.screencast.com/t/KHqp1Pkf

Looks like the slider itself has some big left margin:
https://www.screencast.com/t/58QWpHhqN

I would bug their support some more.

If not check out Smart Slider 3. It’s my preference when a slider is needed.

[Alex]

Thank you for your great and prompt support, guys!

[Leo]

No problem 🙂

[Author]

Posts