Space below menu only in Safari - Opera (chromemenu)

**gdguide** · 06-25-2006, 02:03 PM

Chromemenu
http://www.adigitaldreamer.com/indexdhtmlmenu.htm

I'm working with chrome menu on my site, and am quite happy with it for IE and Firefox. But for Safari (seems like 9% of my viewers use it), and Opera,some funny things happen. In both Safari and Opera, there's a space under the menu of about what looks to be like maybe 50 pixels. Is there any way to remove this space? Is there something that I'm missing there?

Thanks for any help on this

**jscheuer1** · 06-25-2006, 05:40 PM

There could be a better way and I have no idea if this will work in safari. Also, it changes the layout in FF but not in an unacceptable manner:

Add this inline style to the menu container:

Code:

<div class="chromestyle" id="chromemenu" style="z-index:100;position:relative;">

and this to the table below it:

Code:

<table width="760" border="0" cellpadding="0" cellspacing="0" class="gridbackground" style="margin-top:-15px!important;margin-top:0;position:relative;">

**jscheuer1** · 06-25-2006, 06:51 PM

This is a better solution. Once again, I cannot say anything about safari (I have no Mac) but this is good in FF, IE and O. Go back to what you had before my previous solution and add this style section (these rules could be added at the end of the chromestyle.css file as well, or integrated into it:

Code:

<script type="text/javascript" src="chromejs/chrome.js">

/***********************************************
* Chrome CSS Drop Down Menu- © Dynamic Drive DHTML code library (www.dynamicdrive.com)
* This notice MUST stay intact for legal use
* Visit Dynamic Drive at http://www.dynamicdrive.com/ for full source code
***********************************************/

</script>
<style type="text/css">
.chromestyle {
position:relative;
height:2.45em;
}
.chromestyle ul{
position:absolute;
}
</style>
</head>


<body bgcolor="#006699" text="#003366" link="#003366" vlink="#006699" alink="#006699" onLoad="">

**gdguide** · 06-25-2006, 08:59 PM

Thanks so much for that. It works now on Opera, so hopefully it will work in Safari as well. I'll get someone to check for me.

Thanks again

Brian

**djr33** · 06-25-2006, 10:17 PM

What should I check?

Or... nevermind... i'll just give you a screencap.

Safari:

**gdguide** · 06-26-2006, 02:49 AM

Hey,thanks!

Can you check one more thing on Safari? I've been hearing that Safari is showing some flickering on the menu when your mouse goes over the menu headers? is this happening with you?

Thanks a Million

I gotta get me a Mac,especially now that you can dual boot with Windows.

Cheers!

Brian

Originally Posted by djr33

What should I check?

Or... nevermind... i'll just give you a screencap.

Safari:

**ericnguyen** · 07-03-2007, 08:47 PM

I posted this on another thread, but it may apply here, as well:
---
Hi, all. I patched the dropdown.js script to handle the case where one of the ancestor elements is relatively positioned. In this case, the absolute positioning of the menu is relative to that "containing block" and the offset calculation should end there.

Here is the modified function (getposOffset), with an nested function to handle IE, Safari, and Firefox:

Code:

getposOffset:function(what, offsettype){
  function getStyle(el,styleProp) {
  	if (typeof el.currentStyle != "undefined") {
  		var y = el.currentStyle[styleProp];
  	} else if (typeof document.defaultView != "undefined" && typeof document.defaultView.getComputedStyle != "undefined") {
  		var y = document.defaultView.getComputedStyle(el,null).getPropertyValue(styleProp);
  	} else {
  		var y = el.style[styleProp];  	  
  	}
  	return y;
  }
  
  var totaloffset=(offsettype=="left")? what.offsetLeft : what.offsetTop;
  var parentEl=what.offsetParent;
  while (parentEl!=null && getStyle(parentEl, "position") != "relative"){
    totaloffset=(offsettype=="left")? totaloffset+parentEl.offsetLeft : totaloffset+parentEl.offsetTop;
    parentEl=parentEl.offsetParent;
  }
  return totaloffset;
},

Thread: Space below menu only in Safari - Opera (chromemenu)

Thread Tools

Search Thread

Space below menu only in Safari - Opera (chromemenu)

Bookmarks

Bookmarks

Posting Permissions