Mobile slider width

Resolved wantedstarling
(@wantedstarling)

5 months, 2 weeks ago

Hello, I have two sliders, one on my homepage and the other inside the link I attached. The problem is that on mobile the images do not get resized and you only see a quarter of the image, the size of the screen. If you try to slide and change image then you see the whole image going through the screen and then it goes to the next slide. I tried enabling Limit Slide Width for mobile and the Global breakpoints but nothing works. Any suggestion?

Thank you for your time

The page I need help with: [log in to see the link]

Viewing 4 replies - 1 through 4 (of 4 total)

Plugin Support Nextend Support – Ramona
(@nextend_ramona)

5 months, 2 weeks ago

Hi @wantedstarling

Is it possible that you disabled the Downscale option at your slider at Slider settings > Size tab > under Layout: Boxed?
https://smartslider.helpscoutdocs.com/article/1775-boxed-layout

Your slider looks like it doesn’t get smaller at all, and turning off the Downscale option does just that. So if it’s disabled, I recommend turning it back on.

Thread Starter wantedstarling
(@wantedstarling)

5 months, 2 weeks ago

Hello, this solved the problem for the attached page where I have selected Boxed but on the home page the slider is Full Width and this option is missing. Something I can do there?

Thank you

Plugin Support Nextend Support – Ramona
(@nextend_ramona)

5 months, 2 weeks ago

Hi @wantedstarling

I checked the slider on your home page and that does get smaller with the browser size fine.

The issue you’re probably seeing is that it’s based on the “Slide background image fill” option: https://smartslider.helpscoutdocs.com/article/1809-slider-settings-slides
how your images look like in the slider. By default the “fill” option is used which will make the image as big as it needs to be to cover the whole slider. This means that if the slider and image ratios differ, the image will be cropped.

To avoid this behavior you could change the fill mode to “fit” or “blur fit” instead or use images which have the same size as your slider’s size: https://smartslider.helpscoutdocs.com/article/1774-slider-settings-size

The first image in your slider is 1920x780px. On a 375px wide mobile your slider is 375x270px. To make the 1920x780px image fit into your slider without cropping, it would need to have 152px height. Since the height is bigger and you use the “Fit” fill mode the slider needs to scale the image to cover the slider, and that is why the crop happens.

You should either change the slider size or the Slide background image fill value to avoid the cropping.

Thread Starter wantedstarling
(@wantedstarling)

5 months, 2 weeks ago

Problem solved. Thank you so much.

Viewing 4 replies - 1 through 4 (of 4 total)

You must be logged in to reply to this topic.

Views