NaveedIrshad
New Member
Let say I have the code as below:\[code\]<!DOCTYPE HTML><html><head><style>#overlay_form{ position: absolute; border: 5px solid gray; padding: 10px; background: white; width: 270px; height: 190px;}#pop{ display: block; border: 1px solid gray; width: 65px; text-align: center; padding: 6px; border-radius: 5px; text-decoration: none; margin: 0 auto;}</style><script src="http://stackoverflow.com/questions/15852401/jquery.js"></script><script type="text/javascript">$(document).ready(function(){ //open popup $("#pop").click(function(){ $("#overlay_form").fadeIn(1000); positionPopup(); }); //close popup $("#close").click(function(){ $("#overlay_form").fadeOut(500); });});//position the popup at the center of the pagefunction positionPopup(){ if(!$("#overlay_form").is(':visible')){ return; } $("#overlay_form").css({ left: ($(window).width() - $('#overlay_form').width()) / 2, top: ($(window).width() - $('#overlay_form').width()) / 7, position:'absolute' });}//maintain the popup at center of the page when browser resized$(window).bind('resize',positionPopup);</script></head><body><a href="http://stackoverflow.com/questions/15852401/#" id="pop" >PopUp</a><br /><form id="overlay_form" style="display:none"><h2> Put your contents here..</h2><label>Username: </label><input type="text" name="username" /><br /><br /><label>Password: </label><input type="text" name="password" /><br /><br /><input type="button" value="http://stackoverflow.com/questions/15852401/Login" /><a href="http://stackoverflow.com/questions/15852401/#" id="close" >Close</a></form></body></html>\[/code\]This is a popup dialog example. Let say I want to use this dialog in all my webpages (a.html, b.html, c.html and etc), what is the best and easiest way to make the code above to be reusable? Because I think that to copy paste the 'overlay_form' into every html pages is not reasonable. I am still at the beginning level in Javascript, so to create a jQuery plugin for this is too hard for me. That's why I would like to seek for other ways to do it. Thanks.