Hello all,
I was wondering if there is a way to increase the size of a single image in a fullwidth slider on a mobile to reflect how it looks like on a desktop.
The image, when viewed on mobile, gets constrained. Is there a way to override this?
Hi Drebosio!
You can turn on Custom CSS field for ALB elements ( http://kriesi.at/documentation/enfold/turn-on-custom-css-field-for-all-alb-elements/ ) and give your existing slider a unique CSS class ( i.e.: desktop-slider ) and create another slider right below it just to display on mobile and give it a unique class as well ( i.e.: mobile-slider ) and then add following code to Quick CSS in Enfold theme options under General Styling tab
@media only screen and (min-width: 769px) {
.mobile-slider { display: none !important; }}
@media only screen and (max-width: 768px) {
.desktop-slider { display: none !important; }}
Best regards,
Yigit
Hey Yigit,
Thanks for responding, that ALB feature is awesome, glad i have it activated now.
The only thing is, once i’ve updated the css, and tested it on a smartphone…i’m not seeing a difference. the image/slider is still being forced down
the width is fine, but i want to extend the height on mobile.
Any thoughts on how to accomplish this?
Hi!
Please upload different images on mobile slider. They should be smaller in width and bigger in height
Regards,
Yigit
sweet thanks yigit!