Streaming live at 10am (PST)

Moving SLIDER Nav bar on the top of the slides


#1

Has anyone worked out how to move the slider nav dot bar to above the slides?

Reason why:
I've gotten rather creative with them in getting the slide and Webflow css settings to scale gracefully all the way to small mobile sizes and I really like using the Webflow sliders about anywhere on a site. The one thing that is left to work out is when I have odd size slides, the dot nav bar seems to need to be absolute in order to show correctly, but then it will be way below the view area with a lot of of blank space between it and the short slide and may cause some confusion as if is not there. This is not caused by the arrow navs as I prefer to remove then in that they do do easily scale down gracefully staying in the same visual proportionate position so I remove them from the slider.

Another possible solution would be to figure out how to get the nav to show just below the slide no matter what height it is, so far I've not found a way to do that so was imagining putting it on top would be a good solution too.

Thanks!


#2

It is very difficult and hacky to relocate the dot nav / nodes to me. I can force them with absolute or relative offsets using pixels or percentages, but the dimensions and default location are very different than expected. If you are using a fixed height for the slider, just use pixel offsets. If you are using a percentage of browser height you will experience problems with the nav floating with page height.

You can also set the nav to float and gain more positioning control outside the slider bounds. I don't know if you can set the slider, mask and slide heights to auto, but that may allow the nodes to float below the content.

If you come up with a good solution please post it.


#3

thanks for the tips, I'll tweak with it and post back if I get something to work


#4

I tried making it float below the slide height - could not make it work.


#5