It's nice to see the contact form to open in popup window. To open our contact form script in popup window you have to make the following modification.
Ajax DHTML popup contact form has been released.
Demo | Report bug | Documentation | Download
<script>
if(window.name!='ContactUs'){location.href='your home page url';}
</script>
2. Add the following javascript code between <head> and </head> tags of the page(s) from where you want to open your contact page. This script actually opens your contact form in popup window.
<script type="text/javascript">
function popup(){
var url = "contact-us.php";
window.open(url,'ContactUs','width=500,height=550,toolbar=no,location=no,directories=no,status=yes,menubar=no,scrollbars=yes,copyhistory=yes');
}
</script>
3. And finally create a clickable link to run the javascript popup to your
contact page.
<a href="javascript:popup()">contact</a>View demo here
DHTML POPUP:
| ||||||||||
Contact us (DEMO):
___________________________ PHP contact-form copyright ramui.com |
DHTML popup window are not real window at all. They are actually HTML elements like division, paragraph etc. Initially they are kept hidden. When you click a link to open a DHTML popup a JavaScript function is called which make the HTML element visible. More advanced JavaScript codes are used to track the mouse event and to control drag operation. Here is a simple example of DHTML popup.
<script type="text/javascript">
<!--
function fw_DHTML_popup(){document.getElementById('popup').style.display='block';}
function fw_close(){document.getElementById('popup').style.display='none';}
-->
</script>
<style type="text/css">
#popup{border:1px solid #FFFFFF; position: absolute; left: 100px; top: 20px; width: 300px; z-index: 100; color: #000000; padding: 4px; background-color: #ffffff; display:none;}
</style>
Add the following lines of code any where between <body> and </body> tags.
<div id="popup"> <table cellspacing="0" style="clear:both; border:2px outset;"><tr><td style="background:#444444;"><div style="float:left; clear:left; color:#ffffff;padding-left:3px; vertical-align:middle;">DHTML POPUP:</div> <a href="javascript:fw_close();"> <img style="float:right; border:1px solid #660000;" src="close.png" width="20" height="19" /></a></td></tr><tr><td style="padding:5px; clear:both; border-left:1px solid #dddddd; border-bottom:1px solid #dddddd; border-top:1px solid #888888; border-right:1px solid #888888; background:#ffffff;"> <!-- Put your HTML code to be displayed on popup window. --> </td></tr></table></div>