I’m looking to create a slider like this:
http://kaisertrabue.com/index.html
The height and width are responsive to the logo and nav elements. Any idea how to achieve this?
I’m looking to create a slider like this:
http://kaisertrabue.com/index.html
The height and width are responsive to the logo and nav elements. Any idea how to achieve this?
Hey @sarastrese1 great question! Building a slider like that what you will need to do is the following:
(1) Add in a section element and then a slider element inside of it to your Webflow site
(2) Make the Section element 100% width, and 100vh for the height (type in 100vh into the height field) and add padding to the section as needed
(3) Make the slider 100% width & a certain height (say 80vh or 90vh) with padding
(4) Set a class on the slides of say “Slide” and give it a background image which is set to: Cover with no repeat. Then for each subsequent slide, give it a Combo class (click in the Selector field and type in an additional class name) and change the background image
(5) Within the slider settings, set the slider to a Fade transition & autoplay
(6) The logo can be set to a fixed position in the top right of the page, make sure it has a set width & height, maybe 220px width by 80px height or so (those could be your max-widths and you can set the width/height to 100% to make it responsive though 240px and under is usually a good width to go with for responsive design).
Please let me know if this helps
That’s totally worked! That is just what I needed to know! Thank you so much!
This topic was automatically closed 60 days after the last reply. New replies are no longer allowed.