mobile responsive visibility

[djigoboom]

Hi,

I’m trying to serve 3 different images depending on the device the user is using: One large image for desktop, one large image for tablet and a smaller retina image for mobile. However when I use the shortcodes for the mobile visibility, the correct images appear on desktop and table, but nothing shows up in mobile. I tested it on an iPhone 4S and an iPhone5.

Even when I remove the code for the images and put the sample text “ENTER THE RESPONSIVE VISIBILITY CONTENT HERE,” the text shows up on desktop and tablet. It does not show up on mobile.

Here is the code I used:

[sf_visibility class=”visible-lg”]
ENTER THE RESPONSIVE VISIBILITY CONTENT HERE
[/sf_visibility]

[sf_visibility class=”visible-md”]
ENTER THE RESPONSIVE VISIBILITY CONTENT HERE
[/sf_visibility]

[sf_visibility class=”visible-lg”]
ENTER THE RESPONSIVE VISIBILITY CONTENT HERE
[/sf_visibility]

[sf_visibility class=”visible-sm”]
ENTER THE RESPONSIVE VISIBILITY CONTENT HERE
[/sf_visibility]

I even tried clearing the cache on both devices. I do not have a caching tool installed yet, so I know that’s not the issue either.

Any idea as to what’s causing this?

I can supply you with site credentials if you need them via private message.

[Kyle – SUPPORT]

Hi

For phones use need to use visible-xs

See: http://getbootstrap.com/css/#responsive-utilities for what classes represent what screen size

– Kyle

[djigoboom]

Thank you. I think you should post that here:

http://dante.swiftideas.net/documentation/#responsive-visibility

Cheers!

[Kyle – SUPPORT]

Thanks for letting us know, I will pass it on to the developer to add to the documentation

– Kyle