Slider Images Disappearing on Mobile

Hi everyone,

I have tried asking this to divi themes forum, but their solutions aren’t working. So could anyone help please?

Site URL: http://cheltenhamandgloucestertiling.co.uk/

I have put a slider on this page about half way down on the left - photos of tiles etc.

It works fine on desktop but disappears on mobile, could you suggest a fix for this please?

Thank you

Chris

The slider doesn’t disappear at mobile widths, but it does become too small to be useful.

Have you tried building that slider on another page as a standalone object using only relevant CSS, none of the surplus HTML and CSS that make the rest of your page work, to see if it works without the additional code in your site?

or You could make a copy of your home page and, using the copy, begin deleting irrelevant HTML and CSS links, testing the broken slider after each change until it no longer “disappears” at mobile widths.

2 Likes

I spent some time looking at the slider with FF Inspector too, and came to the same conclusions as ronpat.

JavaScript is setting inline styles based on screen widths, under 768px is where it makes the drastic change.

On one of the containers it sets a fixed height, at the same time it sets max-height on the images.

At the smallest screen width I could go, I saw the fixed height of the container go down to 6px tall and the image go to max-height 4px.

A quick google search shows a lot of people having the same problem.

Divi Fullwidth Slider Height Adjustment

All the fixes or workarounds I’ve seen involve the use of !important in a new css rule to override the javascript’s inline styles.

Others mention a complete replacement with another slider.

1 Like

This topic was automatically closed 91 days after the last reply. New replies are no longer allowed.