View Full Version : Chrome CSS Drop Down Menu - Safari

02-12-2007, 05:27 PM
1) Script Title: Chrome CSS Drop Down Menu (v2.01)

2) Script URL (on DD):

3) Describe problem:
I know this script says that it works in
FF1+ IE5+ Opr7+

but has anyone made it so that it also works in Safari and other Mac browsers?


02-13-2007, 10:58 PM
The only issue I'm aware of with this script as far as Safari 2.x is the drop down animation. This should be fixed in the next couple of weeks once I have time.

06-12-2007, 04:40 PM

wanted to see if we had any progress on the issues with safari or firefox on a mac?

06-12-2007, 04:55 PM
Ah, sorry, haven't gotten around to it yet. I did notice the problem with the sliding animation no longer occurs in Safari 3 beta, at least not in Windows.

07-03-2007, 08:45 PM
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:

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;
return totaloffset;

07-12-2007, 02:23 PM
Hi Ericnguyen,

I am rather new to editing js files... I have copied the text from your post and replaced it with the similar (but shorter) code in the original chrome.js file. Unfortunately it's still not working on a mac with safari 2.x

Could you or someone else please help me out here?

Many thanks

07-12-2007, 04:21 PM
Do you have a link to the broken page? "Not working" will never help anyone help you.

07-12-2007, 05:04 PM

I am sorry I should have sent a link, but directly after my original post I was trying some other things and noticed the menu did work on the previous layout of my site. I have then copied the chrome.css part of the old stylesheet over the new stylesheet and I just received an email from my pal that it's working fine now. I apparently made an error in the new stylesheet.

Thanks for your fast reponse by the way. The Chrome Menu is absolutely perfect as you can see at: http://www.islayinfo.com :)

11-20-2007, 05:08 PM
The dilemma seems to be with how Safari registers onmouseover events. It keeps triggering to redraw the menu with every tiny mouse movement (keeps triggering onmouseout/onmouseover/onmouseout/onmouseover while the other browsers handle this properly.

I've been trying to find a way to correct this behavior (test for Safari and disable onmouseout after an onmouseover??) with no luck yet.

Has anyone successfully fixed this?