<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> <head> <style> /*----popper -------------------*/ #blanket { background-color:#111; opacity: 0.65; filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=70); position:absolute; z-index: 999001; top:0px; left:0px; width:100%; } #popUpDiv { position:fixed !important; top:0px; left:0px; width:300px; height:300px; z-index: 999002; } #popUpDivAuthorArticle, #popUpDivAboutUs { position:fixed !important; top:200px !important; border-radius:3px; -moz-border-radius:4px; -webkit-border-radius:4px; border-radius:4px; z-index: 999003; overflow:hidden !important; } #popUpDivAuthorArticle { background-color:#FFF; width:350px; height:auto; color:#000; padding:10px; } #popUpDivAboutUs { background-color:#FFF; width:600px; height:auto; left:18% !important; color:#000; padding:10px; } </style> <script type="text/javascript"> /*<![CDATA[*/ function toggle(div_id) { var el = document.getElementById(div_id); if ( el.style.display == 'none' ) { el.style.display = 'block';} else {el.style.display = 'none';} } function blanket_size(popUpDivVar) { if (typeof window.innerWidth != 'undefined') { viewportheight = window.innerHeight; } else { viewportheight = document.documentElement.clientHeight; } if ((viewportheight > document.body.parentNode.scrollHeight) && (viewportheight > document.body.parentNode.clientHeight)) { blanket_height = viewportheight; } else { if (document.body.parentNode.clientHeight > document.body.parentNode.scrollHeight) { blanket_height = document.body.parentNode.clientHeight; } else { blanket_height = document.body.parentNode.scrollHeight; } } var blanket = document.getElementById('blanket'); blanket.style.height = blanket_height + 'px'; var popUpDiv = document.getElementById(popUpDivVar); popUpDiv_height=blanket_height/2-150;//150 is half popup's height popUpDiv.style.top = popUpDiv_height + 'px'; } function window_pos(popUpDivVar) { if (typeof window.innerWidth != 'undefined') { viewportwidth = window.innerHeight; } else { viewportwidth = document.documentElement.clientHeight; } if ((viewportwidth > document.body.parentNode.scrollWidth) && (viewportwidth > document.body.parentNode.clientWidth)) { window_width = viewportwidth; } else { if (document.body.parentNode.clientWidth > document.body.parentNode.scrollWidth) { window_width = document.body.parentNode.clientWidth; } else { window_width = document.body.parentNode.scrollWidth; } } var popUpDiv = document.getElementById(popUpDivVar); window_width=window_width/2-150;//150 is half popup's width popUpDiv.style.left = window_width + 'px'; } function popup(windowname) { blanket_size(windowname); window_pos(windowname); toggle('blanket'); toggle(windowname); }/*]]>*/ </script> <!--[if gte IE 5]> <style type="text/css"> #blanket {filter:alpha(opacity=65);}</style><![endif]--> <body> <a href="#" onclick="popup('popUpDivAuthorArticle')" class="authorProfile">Published by: </a><br><br> <a href="#" onclick="popup('popUpDivAboutUs')"> About Us</a> <div id="blanket" style="display:none;"></div> <div id="popUpDivAuthorArticle" style="display:none;"> <p>popUpDivAuthorArticle popUpDivAuthorArticle popUpDivAuthorArticle popUpDivAuthorArticle popUpDivAuthorArticle popUpDivAuthorArticle popUpDivAuthorArticle popUpDivAuthorArticle popUpDivAuthorArticle popUpDivAuthorArticle popUpDivAuthorArticle popUpDivAuthorArticle popUpDivAuthorArticle popUpDivAuthorArticle popUpDivAuthorArticle popUpDivAuthorArticle </p> <center><a href="#" onclick="popup('popUpDivAuthorArticle')" class="closepopper">Go Back to Article</a></center> </div> <div id="popUpDivAboutUs" style="display:none;"> <p>popUpDivAboutUs popUpDivAboutUs popUpDivAboutUs popUpDivAboutUs popUpDivAboutUs popUpDivAboutUs popUpDivAboutUs popUpDivAboutUs popUpDivAboutUs </p> <center><a href="#" onclick="popup('popUpDivAboutUs')" class="closepopper">Go Back to Article</a></center> </div> </body> </html>