Support Image Slider Size and Dimensions

[ScratchMang]

Not a 'Bug' per se....

However, the Image Slider when placed on the forums will take the banner and enlarge it to the dimensions of the screen rather than using the original dimensions of the 'Banner Image' itself.

So for instance, a banner that is 750x150 when displayed get's enlarged to the screen size and can be displayed 1392x280.

Is there some way in which to have the banner's displayed at their "Original" dimensions when displayed on a Large screen (Laptop or PC) and still be 'responsive' when displayed on a Phone or Tablet?

Thanks.

 

[ScratchMang]

Oh wait....

I think I found it. But I'll post it here in case someone else is looking....

In the CSS Template "xfa_slider_owl_carousel.css"

Search for this section....

.owl-carousel .owl-item img{display:block;width:100%;-webkit-transform-style:preserve-3d}

And Modify the "WIDTH:100%" to whatever you prefer...

.owl-carousel .owl-item img{display:block;width:60%;-webkit-transform-style:preserve-3d}

In My case I "Shrunk" the banner image to display at 60% rather than 100%
Also, when you do this, the Banner will align "Left" of the screen.

So adding "margin:auto;" right after the "width:60%" will center it once again....

.owl-carousel .owl-item img{display:block;width:60%;margin:auto;-webkit-transform-style:preserve-3d}

I've tested this, and the results remain "Responsive" on Phones and tablets.

Excellent Addon!


Hope this helps

Scratch