crf1121359 Posted November 14, 2012 Share Posted November 14, 2012 I have a modal popup that will open on a button click. I just need this to open on page load if possible! I am using the code that I found here: http://dhtmlpopups.webarticles.org/movable.php could someone please help me with this? Thank you in advance here is my code: <body> <style type='text/css'> .dragme { cursor: move } </style> <script type='text/javascript'> var ie = document.all; var nn6 = document.getElementById &&! document.all;var isdrag = false; var x, y; var dobj; function movemouse( e ) { if( isdrag ) { dobj.style.left = nn6 ? tx + e.clientX - x : tx + event.clientX - x; dobj.style.top = nn6 ? ty + e.clientY - y : ty + event.clientY - y; return false; } }function selectmouse( e ) { var fobj = nn6 ? e.target : event.srcElement; var topelement = nn6 ? "HTML" : "BODY"; while (fobj.tagName != topelement && fobj.className != "dragme") { fobj = nn6 ? fobj.parentNode : fobj.parentElement; } if (fobj.className=="dragme") { isdrag = true; dobj = document.getElementById("styled_popup"); tx = parseInt(dobj.style.left+0); ty = parseInt(dobj.style.top+0); x = nn6 ? e.clientX : event.clientX; y = nn6 ? e.clientY : event.clientY; document.onmousemove=movemouse; return false; } } function styledPopupClose() { document.getElementById("styled_popup").style.display = "none"; }document.onmousedown=selectmouse; document.onmouseup=new Function("isdrag=false"); function fireMyPopup() { myPopupRelocate(); document.getElementById("mypopup").style.display = "block"; document.body.onscroll = myPopupRelocate; window.onscroll = myPopupRelocate; } document.body.onload = window.setTimeout("fireMyPopup()", 1500);</script> <div id='styled_popup' name='styled_popup' style='width: 380px; height: 300px; display:none; position: absolute; top: 150px; left: 50px;'> <table width='380' cellpadding='0' cellspacing='0' border='0'> <tr> <td><img height='23' width='356' src='images/x11_title.gif' class='dragme'></td> <td><a href='javascript:styledPopupClose();'><img height='23' width='24' src='images/x11_close.gif' border='0'></a></td> </tr> <tr><td colspan='2' style='background: url("images/x11_body.gif") no-repeat top left; width: 380px; height: 277px;'> Drag my window title to see me moving :-) </td></tr> </table> </div><input type='submit' onclick='document.getElementById("styled_popup").style.display="block"' value=' Fire! '> </body> </html> Quote Link to comment https://forums.phpfreaks.com/topic/270672-how-to-show-modal-popup-on-page-load/ Share on other sites More sharing options...
codefossa Posted November 14, 2012 Share Posted November 14, 2012 You can do either window.onload = myfunc; or window.addEventListener("load", myfunc, false); Quote Link to comment https://forums.phpfreaks.com/topic/270672-how-to-show-modal-popup-on-page-load/#findComment-1392386 Share on other sites More sharing options...
Adam Posted November 14, 2012 Share Posted November 14, 2012 Just to add, what you have here: document.body.onload = window.setTimeout("fireMyPopup()", 1500); Despite the fact that document.body.onload doesn't actually exist, you're not binding the timeout to the onload event like you may be expecting. What you're actually doing is immediately invoking the setTimeout() function and storing the returned timer ID to the onload property. That means even if the page took a further 2 seconds to load for whatever reason, fireMyPopup() would be called after 1.5, and possibly before the resources needed to render it are available. You need to store a callback at window.onload, or as Xaotique mentioned, use the preferred window.addEventListener method. Quote Link to comment https://forums.phpfreaks.com/topic/270672-how-to-show-modal-popup-on-page-load/#findComment-1392451 Share on other sites More sharing options...
Recommended Posts
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.