Agile Sliders on Mobile Devices

[DjKnock]

I finally figured out the right size, and how the sliders sort of work, but after landing it right on the computer and laptop, I noticed, that the slider looked all messy on a mobile device (iPhone) . So I come for some help on this

Site:

MountainWestElectric.com

[DjKnock]

Hi guys, just checking in if anyone has been able to taken a look on this, still haven’t figured it out

[Nexus]

Can you pls share the login details as a private message here so that I can take a look at the backend? I think the grid size might not be right. Thanks for your patience 🙂

[DjKnock]

This reply has been marked as private.

[Nexus]

Indeed, I see all messed up when in mobile mode. The problem I see is nothing to do with any settings and only with the content. There are lots of elements that are fighting for the limited real estate in the smaller resolution. Unfortunately you cannot do much with it other than reducing the slide contents. And also in some of the slides the contents are placed very close to each other which will affect them when the resolution is small.

Also if you want to control the elements with custom css then here is some css you will want to consider

@media only screen and (max-width: 479px), @media only screen and (max-width: 767px)
{
	.tp-caption .button {
	padding: 4px 6px;
	font-size: 11px;
	}
}

You can control any element using media queries.

Also, I see that you are using a older version of Revolution Slider. Pls download the latest theme package and update the plugin by locating the latest version of “revslider.zip” file inside the “Revolution Slider setup Instructions” folder.

Thanks!

[Author]

Posts