Trigger on page load or on scroll

[4goodapp]

Hi,
Is it possible to show the panel on like 5 second after the page load or maybe after user scroll the page?

[Flyer53]

Hi there

Sure, for the page load you could use

window.addEventListener('load', (event) => {
  console.log('page is fully loaded');
  jsPanel.create();
});

To add a 5 sec delay just wrap the function creating the panel in a setTimeout like

window.addEventListener('load', (event) => {
  console.log('page is fully loaded');
  window.setTimeout(function(){
    jsPanel.create();
  }, 5000);
});

Take a look at:
https://developer.mozilla.org/en-US/docs/Web/API/Window/load_event
https://developer.mozilla.org/en-US/docs/Web/API/WindowOrWorkerGlobalScope/setTimeout

For scrolling it's basically the same. Look at:
https://developer.mozilla.org/en-US/docs/Web/API/Document/scroll_event
https://developer.mozilla.org/en-US/docs/Web/API/Element/scroll_event

[4goodapp]

Thank you for the response, gonna check this, will let you know.
I want use it for newsletter popup.

[4goodapp]

It works as I expected.
I still have some questions tho.
Like let's suppose I already coded my own popup/modal design with image and inputs with CSS style, how can I integrate it with jsPanel?
Cause I noticed a basic jsPanel setup as it's own default design with header, title and size predefined.

[Flyer53]

There are quite a few options dealing with adding content to the panel. Take a look at:
https://jspanel.de/#options/content
https://jspanel.de/#options/contentAjax (which is the one you should use I think)

Also the header section can be configured using various options where option header is the most basic one. Please read the docs about all the other available options.

[4goodapp]

Thank you, It's working like I wanted now :)