Make Fusion Slider Responsive

[MetroGrafix]

#511707

My sliders are generally only images. The text is all built in Photoshop and everything is flattened and saved as jpegs. Works fine on a large enough screen, but on mobile, all my sliders are severely cropped left and right. Is there some setting I’m missing to keep sliders from being cropped on mobile? I always want to see the entire image frame no matter the screen size.

[pbeaulieu]

#511840

If your site is responsive, you images should resize.It is not best practice to put text on images, as you will get cropping. If you must do this, you you should create 3 different images.For example:

Website: 1280 X 640 or 320
Tablet: 640px
Phone: 320px

After that use CSS to define the parameters.

img hero-1 {
max-width: 100%;
height: auto;
width: auto\9; /* ie8 */
}

img hero-2 {
max-width: 100%;
height: auto;
width: auto\9; /* ie8 */
}

If you define what the images do the browser will display them correctly. Since you are using text, it is important to resize the images first.

[jeanliu668]

#525882

Upload these two images (Tablet: 640px Phone: 320px) to where, how to set ? can you advise by details ? thanks.

[Author]

Posts