Confetti Not Shown in Fullscreen

[ankpham]

I am making an app that uses a full screen. However, when the confetti is executed, since the party-js element is outside of my fullscreen div element, it won't show when in full screen. Is there anyway to move the element and nest it inside my own element or manually render it?

[yiliansource]

Hi, the container element should automatically fit to screen size. Could you maybe provide a minimal, reproducable example?

[ankpham]

My app allows the div to be viewed in full screen, however, the party js container is outside of that full screen. Therefore, it is not shown in the full screen container as it is not nested within it even if it is scaled to full screen size, it is not included in the full screen.

What I need is the ability to move the partyjs container within my full screen div so that it appears in full screen mode.
I'm using this for full screen: https://www.w3schools.com/howto/howto_js_fullscreen.asp Scroll down to "Fullscreen Document".

  <div className="fullscreen-container">
        Full Screen Content here
  </div>
  <div className="party-js-container"/>

[ankpham]

Hey, do you have any updates on this?

[yiliansource]

Hi sorry, uni is keeping me busy.

I'm currently not sure on how to approach this, since I'm unsure how the fullscreen API operates. I'll definitely look into this, and I will let you know what I can do!

[ankpham]

No worries, take your time!

[ankpham]

Hello, the project I'm working on that uses requires the confetti effect to work soon and I believe I've found a solution. Since the fullscreen api selects an element and all its child nodes in it to be viewed in full screen, all that's needed is to have the option to move the confetti container.