Streaming live at 10am (PST)

Positioning slidernav relative to slider content

So on my site, there is a slider with a video and a description below in each slide. I want my slider nav to be shown on between each video and description, but as the slider nav has to be positioned absolute and the video (below where the slider nav should sit) is responsive, the absolute positioning messes things up…

I thought about two workarounds:

  1. Use custom jQuery to get the current hight from the video and use that as position top for the slider nav. BUT I can’t really code, so I don’t exactly know how to do it.

  2. I found this video here:
    It uses the appendTo function and with it I could append the nav into a different div which could sit under a placeholder video which acts like and sits on top of the other videos, but with 0 opacity and lower z-index, so it only dictates the height to the slider nav but is not visible otherwise. (I hope I explained that well :grimacing:) But I can’t get the code to work… If I look on it in the developer tools on chrome, I can see that the slidenav is indeed positioned inside the div, but it is not visible…

Any help to solve this problem would be greatly appreciated!

Here is my site Read-Only: LINK
Here is my site published: LINK

1 Like