NEED HELP! Fixed div not showing correctly when using fullpage.js

Hello people!

I really hope there is someone out there who can help me with my problem. I’m trying to create i custom lightbox (sort of) on a page where i also use fullpage.js. I’ve managed to create the grid that I want and also the effect needed to display and hide the big pictures using webflow interactions. The problem though, is that when i click on a picture, the fixed div that I’ve created that is supposed to pop up in front of everything only shows up at the top of the page :-/

This means that whenever i click on one of the thumbnail images I have in my grid, I have to scroll up to the top to first of all find the big picture, and second, close it.

Hope I’m not being to confusing in my description and that there is someone out there who can help me fix this problem!! I would really appreciate any help I can get!!

Here is a link to the page in question;

http://chpe.webflow.io/mina-bilder

And here is a link to the webflow project. the page in question is called MINA BILDER;

https://preview.webflow.com/preview/chpe?preview=2b367d7230d4d78f07aeda0c27398bd3

Thanks in advance guys!

Best regards
/Victor

Fixed elements should be placed outside the fullpage.js container.

So basically:

  • fixed div
  • fullpage container
    — section
    — section
    — section
1 Like