Pop Out box has a strange block of nothing at the top

brysonprice · February 26, 2011

On the CONTACT page, there is a GMAIL logo. When this logo is clicked, a box pops out and the background becomes greyed-out. I like the box, but there is a block of nothing at the top of the box! Where is this coming from?

******* I have 2 GMAIL logos, CLICK THE ONE ON THE RIGHT FOR THE CONTACT FORM POP OUT BOX TO APPEAR ********

here is a pic of the problem:

here is the code:

<!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">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<title>Bryson Price Music</title>
<link href="styles.css" rel="stylesheet" type="text/css" />
   <title>bryson price contact</title>
       <script type="text/javascript">
var GB_ROOT_DIR = "./greybox/";
function MM_swapImgRestore() { //v3.0
 var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++) x.src=x.oSrc;
}
function MM_preloadImages() { //v3.0
 var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();
   var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++)
   if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}}
}

function MM_findObj(n, d) { //v4.01
 var p,i,x;  if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) {
   d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
 if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];
 for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document);
 if(!x && d.getElementById) x=d.getElementById(n); return x;
}

function MM_swapImage() { //v3.0
 var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array; for(i=0;i<(a.length-2);i+=3)
  if ((x=MM_findObj(a[i]))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2];}
}
       </script>

   <script type="text/javascript" src="greybox/AJS.js"></script>
   <script type="text/javascript" src="greybox/AJS_fx.js"></script>
   <script type="text/javascript" src="greybox/gb_scripts.js"></script>
   <link href="greybox/gb_styles.css" rel="stylesheet" type="text/css" media="all" />

   <script type="text/javascript" src="static_files/help.js"></script>

</head>
<body onload="MM_preloadImages('img/rollyoutube.png','img/rolltwitter.png','img/rollfacebook.png','img/rollgmail.png')">
<div class="header"><span class="Biography"><img src="img/contact.png" alt="biography" width="435" height="107" vspace="50" /></span>
</div>
<div id="wrapper">
 <div class="Biography" id="biography">
 </div>    
 <div class="belowheader" id="belowheader"><img src="img/newbelowheadcontact.png" width="390" height="123" alt="belowheader" />
 </div>
<div class="biobody" id="biobody">
 <div class="youtubetwitter"><a href="www.youtube.com/brysonprice" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('youtube','','img/rollyoutube.png',1)"><img src="img/youtube.png" name="youtube" width="213" height="87" border="0" id="youtube" /></a><a href="www.twitter/brysonprice" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('twitter','','img/rolltwitter.png',1)"><img src="img/twitter.png" name="twitter" width="213" height="87" border="0" id="twitter" /></a></div>
 <div class="facebook"><a href="www.facebook.com/brysonprice" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('facebook','','img/rollfacebook.png',1)"><img src="img/facebook.png" name="facebook" width="217" height="91" border="0" id="facebook" /></a><a href="#" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('gmailroll','','img/rollgmail.png',1)"><img src="img/gmail.png" name="gmailroll" width="213" height="87" border="0" id="gmailroll" /></a><a href="form.html" title="Google" rel="gb_page_center[640, 480]"><img src="img/gmail.png" width="213" height="87" alt="gmail" /></a><script type="text/javascript">
GB_myShow = function(caption, url, /* optional */ height, width, callback_fn) {
   var options = {
       caption: caption,
       height: height || 500,
       width: width || 700,
       fullscreen: false,
       show_loading: false,
       callback_fn: callback_fn
   }
   var win = new GB_Window(options);
   return win.show(url);
}
   </script></div>
 </div>
</div>



</body>
</html>

Edited February 26, 2011 by brysonpice

newseed · February 27, 2011

Not enough to go on. Got a url so we can see it in action? Provide details to help us replicate that problem you are having.

brysonprice · February 27, 2011

Not enough to go on. Got a url so we can see it in action? Provide details to help us replicate that problem you are having.

Eddie,

I haven't put any of this on my website yet, but I can send the dreamweaver file...would that help? What else would I need to provide ?

thanks for helping

falkencreative · February 28, 2011

I took a look at the .zip which you linked to. It looks like the popup box's caption/close button table has a class of .header, which is conflicting with your header area which also uses a class of .header. In this case, you have specified that the .header class have a height of 170px, so that applies to wherever the header class is used.

You have a couple options...

-- Use a different class name for your header area (probably easiest)

-- Modify the popup script (if you know how) to use a different class name for the .header area

-- override the popup box's height by adding this to your stylesheet:

#GB_Window .header { height:24px; /* change height as necessary */ }

brysonprice · February 28, 2011

-- Use a different class name for your header area (probably easiest)

I tried doing the first suggestion, but when I changed my header to a different name in the .css style sheet, the header went missing from my pages. Do I have to go in and manually change the name somewhere else after I change the name on my style sheet?

thanks for figuring this problem out for me . You have been a GREAT HELP!

falkencreative · February 28, 2011

You would need to change the class name both within your CSS file, and any instances within your pages. For example:

<div class="header"><span class="Biography"><img src="img/contact.png" alt="biography" width="435" height="107" vspace="50" /></span>
</div>

brysonprice · February 28, 2011

You would need to change the class name both within your CSS file, and any instances within your pages. For example:
<div class="header"><span class="Biography"><img src="img/contact.png" alt="biography" width="435" height="107" vspace="50" /></span>
</div>

Do you what part of the code would change the box size?

You don't know how much I appreciate your help! I've been trying to figure this out for a while

falkencreative · February 28, 2011

You set the size when you initialize the Graybox:

GB_myShow = function(caption, url, /* optional */ height, width, callback_fn) {
   var options = {
       caption: caption,
       height: height || 500,
       width: width || 700,
       fullscreen: false,
       show_loading: false,
       callback_fn: callback_fn
   }
   var win = new GB_Window(options);
   return win.show(url);
}
   </script>

You should be able to change the "500"/"700" to whatever height/width you need.

brysonprice · February 28, 2011

You set the size when you initialize the Graybox:

GB_myShow = function(caption, url, /* optional */ height, width, callback_fn) {
   var options = {
       caption: caption,
       height: height || 500,
       width: width || 700,
       fullscreen: false,
       show_loading: false,
       callback_fn: callback_fn
   }
   var win = new GB_Window(options);
   return win.show(url);
}
   </script>

You should be able to change the "500"/"700" to whatever height/width you need.

that's exactly what I thought, but when I change it, even setting the height and width to 0, it doesn't do anything

Sign In

Pop Out box has a strange block of nothing at the top

Recommended Posts

brysonprice

newseed

brysonprice

falkencreative

brysonprice

falkencreative

brysonprice

falkencreative

brysonprice

Create an account or sign in to comment

Create an account

Sign in

Browse

Activity

Store

Support

Sign In

** Pop Out box has a strange block of nothing at the top **

Recommended Posts

Create an account or sign in to comment

Create an account

Sign in

Pop Out box has a strange block of nothing at the top