[michaywood]

For those interested, I was able to get this issue resolved with an awesome plugin: Revolution Slider. It’s $18 on Code Canyon (comes as an add-on for a lot of themes also). I simply installed the plugin, then made my slider to be a Full Screen slider. This will make it take up the entire size of the browser. The key feature is the OFFSET CONTAINERS area. Just put .site-header, .site-footer into this area, and it’ll make a full screen slider + header/nav + footer all fit to the users screen without having to scroll! I don’t want my images to be cropped any to fit the slider, so just change the image background from COVER to CONTAIN and put the Revolution Slider shortcode on your homepage and you’ll be good to go!

Works great! Going to use it for all other galleries on my site. It plays nicely with the Photographer theme!

[michaywood]

I was able to replicate the desired effect using JSFiddle: http://jsfiddle.net/q6rL4jkk/5/

So there is a fixed header and fixed footer height, and the image in the middle represents the Owl Carousel. As you scale the page to different sizes, the image scales within proportion and centers it (where-as, if you just did max-height:none; on the slider, the image will go 100% wide and then go taller than the window height).

I’ve tried copy/pasting this JSFiddle code onto my External JS and Custom CSS areas of my Photographer site, but it isn’t making a difference it seems. Any help is appreciated!

[michaywood]

Good to hear! Will this also address the homepage image slider size I’m hoping to accomplish as well? I’m wanting the images to be as wide as possible , but not too wide that the images become too tall for the window screen and you have to scroll.

My apologies if I’m having a difficult time explaining! Here’s an example: http://nataliedefnallphotography.com . As you make your browser window shorter (less height) the images scale proportionally. And if you make your browser window skinnier (less width), it does the same, but never makes the image too big in width or height to where you have to scroll to see the image.

Thanks!

[michaywood]

if [slide] can’t be set to have animation/fade, I could use [ken_slider] with sy-box{max-height:none;} so it shows the full image, but it still goes taller than my browser window and requires scrolling to see images (also have social media footer below slider, just FYI)