I want to make a global popup, so I can access it from different pages. I was reading about this and the solution was to add it directly to body tag in index.html tag, so I did that and now I can open it from my other page (page in which html this popup is not added) using this code
$("#about-create-new-game-popup" ).enhanceWithin().popup();
setTimeout(function(){
$('#about-create-new-game-popup').popup('open');
}, 2000);
The problem is this popup is shown during the application load as it is added to index.html page. Can someone please tell me what am I doing wrong here. Thanks.
I have had this problem before.
What you have to do is define it as a popup before the page is loaded.
A popup will only show when you open it, but in the beginning when the page is loaded it's just another div that's why it's shown. Define it as a popup as soon as possible and it should be hidden. simply add this code in the beginning:
$("#about-create-new-game-popup" ).popup();