-
Posts
-
Hi, The fullscreen slider used to be responsive, but it no longer is. Can you please advise? You can see an example here: https://fiestapoolsandspas.com/specials/ and here https://fiestapoolsandspas.com/big-green-egg/.
The slider on the home page is responsive, and the images change size. They used to in the fullscreen slider, but don’t anymore.
Please help!
Thank you!
JustineHey jnightingale!
Thank you for using Enfold.
Note that the image in the full screen slider is set as background and the background size property is set to “cover” which means that it will force the image to cover the whole container but in order to keep the images’ aspect ratio, it has to overflow outside the container. We can set the background size property to 100% or contain but it will distort the image or leave white spaces in the slider container. Use the full width slider element if you want the whole slider image to be visible inside the screen.
Regards,
IsmaelHi Ismael,
So am I understanding you correctly that the full screen slider is not responsive, aka mobile friendly, but that the fullwidth easy slider is? That doesn’t make any sense. In this day and age, why would anyone want to use a slider that doesn’t respond to screen size? Am I missing something?
Thank you,
JustineHi,
The full screen slider is responsive but when the screensize changes a part of the image will be hidden because the slider try to fill the container with the image while maintaining the aspect ratio.
Please try adding this code to the Quick CSS section under Enfold > General Styling or to your child themes style.css file:
/* Slider height in mobile*/ @media only screen and (max-width: 767px){ .avia-builder-el-0.av-minimum-height-100 .container, .avia-builder-el-0.avia-fullscreen-slider .avia-slideshow { height: auto!important; min-height:100%; }}Best regards,
Vinay
- You must be logged in to reply to this topic.