PDA

View Full Version : How Do I Centre Pop-Up Window.


macsolutions
02-29-2008, 07:54 AM
Could someone show me where I am going wrong as I need to have the pop-up window centre inside the browser window.

The script is presently set to show the images in a sized window and I would like to change this to a percentage on the width and height.


I HAVE INCLUDED THE POP-UP SCRIPT AND THE IMAGEVIEWER.HTML BELOW.


POP-UP SCRIPT



<!-- Begin VIEWER AND POP-UP OPTIONS CODE

// ONLY USE lowercase FOR ALL OPTIONS




// GALLERY VIEWER OPTIONS

var viewer = "popup" // OPTIONS: | new | popup | same | New browser or a popup
var width = "600" // WIDTH OF THE POPUP
var height = "600" // HEIGHT OF THE POPUP
var scrollbars = "no" // SHOW SCROLLBARS IN POPUP - yes OR no
var menu = "no" // SHOW MENU IN POPUP - yes OR no
var tool = "no" // SHOW TOOLBAR IN POPUP - yes OR no



// FAQ POPUP OPTIONS

var FAQ_width = 500 // FAQ POPUP HEIGHT
var FAQ_height = 500 // FAQ POPUP HEIGHT
var faqscrollbarS = "0" // TURN ON FAQ SCROLLBARS "1" FOR ON "0" FOR OFF
var FAQviewer = "no" // yes/ FAQ FULL SCREEN OR no/POPUP MODE






// COPYRIGHT 2008 Allwebco Design Corporation
// Unauthorized use or sale of this script is strictly prohibited by law

// YOU DO NOT NEED TO EDIT BELOW THIS LINE






// START IMAGE VIEW CODE

function ViewImage(data) {
if (viewer == "popup") {
windowHandle = window.open('image-viewer.htm' + '?' + data,'windowName',',scrollbars='+scrollbars+',resi zable=no,toolbar='+tool+',menubar='+menu+',width=' +width+',height='+height+'');

}
else if (viewer == "new") {
windowHandle = window.open('image-viewer.htm' + '?' + data,'windowName');
}
else if (viewer == "same") {
window.location = ('image-viewer.htm' + '?' + data);
}
}

// END IMAGE VIEW CODE










// START FAQ POPUP

function popUpFAQ(URL) {
day = new Date();
id = day.getTime();
if (FAQviewer == "no") {
eval("page" + id + " = window.open(URL, '" + id + "', 'toolbar=0,scrollbars=' + faqscrollbarS + ',location=0,statusbar=0,menubar=0,resizable=1,wid th='+FAQ_width+',height='+FAQ_height+'');");
}
else
if (FAQviewer == "yes") {
eval("page" + id + " = window.open(URL);");
}
}









IEMhover = function() {
var IEMh = document.getElementById("menunav").getElementsByTagName("LI");
for (var i=0; i<IEMh.length; i++) {
IEMh[i].onmouseover=function() {
this.className+=" IEMhover";
}
IEMh[i].onmouseout=function() {
this.className=this.className.replace(new RegExp(" IEMhover\\b"), "");
}
}
}
if (window.attachEvent) window.attachEvent("onload", IEMhover);











// End -->




IMAGE VIEWER

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html><head>

<!-- CHANGE THE NEXT THREE LINES -->

<title>The Judi Trevorrow Galleries</title>
<META name="Description" content="Place your website description in this area. This is read by some search engines.">
<META name="KeyWords" content="add, your, keywords and phrases in this area, separated, by, commas, this, is read by only a, few search, engines">

<!-- CHANGE THE ABOVE THREE LINES -->



<META http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<META name="Copyright" content="Allwebco Design Corporation http://allwebcodesign.com/">


<link rel="StyleSheet" href="css/common-style.css" type="text/css">
<link rel="StyleSheet" href="css/CSS Template Colours/gray.css" type="text/css">
<link rel="StyleSheet" href="css/CSS Template Colours/gray-menu.css" type="text/css">


<script language="JavaScript" type="text/javascript" src="css/css.js"></script>


<script language="JavaScript" type="text/javascript" src="javascripts.js"></script>


<META HTTP-EQUIV="imagetoolbar" CONTENT="no">


<script language="JavaScript" type="text/javascript">
<!-- Begin
var message="You may not right mouse click this page.";
if (navigator.appName == 'Microsoft Internet Explorer'){
function NOclickIE(e) {
if (event.button == 2 || event.button == 3) {
alert(message);
return false;
}
return true;
}
document.onmousedown=NOclickIE;
document.onmouseup=NOclickIE;
window.onmousedown=NOclickIE;
window.onmouseup=NOclickIE;
}
else {
function NOclickNN(e){
if (document.layers||document.getElementById&&!document.all){
if (e.which==2||e.which==3){
alert(message);
return false;
}}}
if (document.layers){
document.captureEvents(Event.MOUSEDOWN);
document.onmousedown=NOclickNN; }
document.oncontextmenu=new Function("alert(message);return false")
}
// End -->
</script>




</head>
<BODY BGCOLOR="#FFFFFF" TEXT="#000000">


<!-- OUTER PAGE TABLE-->
<table cellpadding="0" cellspacing="0" border="0" width="100%"><tr><td align="center" valign="top">

<script language="JavaScript" type="text/javascript" src="header.js"></script>









<!-- START CONTENT TABLE -->
<table cellpadding="5" cellspacing="0" border="0" width="100%"><tr><td align="left" valign="top" class="just">















<br><br><br>





<!-- PICTURE TABLE -->
<TABLE cellpadding="0" cellspacing="0" border="0" width="100%"><tr><td align="center">
<script language="JavaScript" type="text/javascript" src="watermark.js"></script

><br>


<!-- CODE THAT DISPLAYS THE GALLERY IMAGE -->

<script language="JavaScript" type="text/javascript">
<!-- // START SCRIPT
if (location.search.length > 0) {
document.write('<img src="gallery/');
document.write(location.search.substring(1));
document.write('.jpg" class="viewer-border"><br>');
}
//-->
</script>


<br>





<!-- START TEXT TABLE -->
<TABLE cellpadding="0" cellspacing="0" border="0" width="500"><tr><td align="left" class="just">



<center>
<span class="picturetitle">

<script language="JavaScript" type="text/javascript">
<!-- // START SCRIPT
if (location.search.length > 0) {
document.write(location.search.substring(1));
}
//-->
</script>

</span>
</center>



<br>
You can edit the text in this area, however, this text is common for all images. Only the image name above will display as a unique name for each image on this viewer page.
<br><br>



</td></tr></table>
<!-- END TEXT TABLE -->











</td></tr></table>
<!-- END PICTURE TABLE -->
















<br><br>

<img src="picts/spacer.gif" width="310" height="10" alt="image"><br>

<br><br>





</td><td align="center" valign="top" width="5">

<img src="picts/spacer.gif" width="5" height="5" alt="image"><br>

</td><td align="center" valign="top" class="sidebarright-width">




<!-- RIGHT SIDEBAR AREA -->






</td></tr></table>
<!-- CONTENT TABLE -->









</td></tr></table>
<!-- END OUTER PAGE TABLE -->



</div>
</BODY>
</HTML>

mangofreak
02-29-2008, 05:57 PM
check this out:
http://www.dynamicdrive.com/dynamicindex8/autocenter.htm

googled an there it was ;)