[Solved] Flexslider Responsive slider help needed

[f7brian]

Hello,
I am building a site and trying to use flexslider by woo themes. I noticed a site that does it really great: https://www.swipely.com/testimonials/
I have failed to get my slider behaving the same way ie: their images slide all the way into the browser sides (shrink content down to illustrate it best)
My slider images disappear at a max width. I can’t seem to figure out where the difference is in the two groups of CSS files.
I’ve copied the swipely site and simplified it here to try to understand it (but to no avail)…
behavior I want: http://www.f7digitaldesign.com/testing/
how site I’m building is: http://www.f7digitaldesign.com/working/
-just can’t figure out the CSS that’s “trapping” my slider in a fixed width and what is allowing it to slide the entire width of the other one. I suspect it is something in how the .flexsider classes are different? Thanks for any help on this.

[Paulie_D]

Your slider seems responsive to me (although the controls aren’t)…I’m not sure what the issue is precisely.

Are you saying you want the images to scale (or not) somehow?

[f7brian]

My site will be a responsive site and I realize flexslider was meant as a responsive slider. But I like how http://www.swipely.com/testimonials/ does it: the background image that is in the slider is a fixed size, but it slides entirely off to the side of the browser window. They do have other information and images that just go away when the site is viewed on a smaller viewport, which I will also be doing once I get there.

If you compare the two pages that I set up w/ the content shrunk in a large browser window and watch the sliding behavior you’ll notice the difference. The one I’m building shows the image cut off as it slides out. It a mystery to me still what CSS differences are going on between these two (I suspect buried somewhere in the different flexslider classes I have got from the woo theme flexslider download, and how the dev of swipely cutomized it).
Also I DO want my controls to be responsive (just havn’t got to that yet).

Thanks so much for reading my post!

F7Brian

[Paulie_D]

I suggest you look through the example(s) you have with the developer tools in your browser to see what properties/settings are different to yours and go from there.

[f7brian]

Okay, thanks. I have done this but can’t see it. I’ll keep working at it.

Thanks for responding to my post.

Oh Mighty CSS Gurus of the world come to my rescue!!

[f7brian]

I figured this out finally! There was a line of CSS specifying 100% width I finally noticed.

–Solved.

[Author]

Posts