Drop-Up On Hover Menu

I need a menu (Like I have as my drop down menu), where you hover over the link, it would drop UP instead of down. It would be nice if the solution is CSS only, but if it involves JavaScript, than I guess I'll live with it... This menu would be generated automatically (Dynamically with PHP).

Hmmm...I would think you already know about script.aculo.us, cause you can definitely do all kinds of crazy tish with that, combine functions to make a menu fade and shrink to a zero point at the same time, the same thing backward, set the length in seconds of the effect, etc, all really damn simply. I am just waiting for "vortex", "puzzle" and "shatter" functions.

But you are now talking both barrels: javascript

http://script.aculo.us/

The one you want is class BlindUp:

Oops what? I don't get that

Sorry, I hit reply instead of edit, but you can't delete a post. Usually this board is slow and I always add stuff after I post and go "hmmm"; anyway, scroll back up and look where the oops used to be.

Have you really never heard of script.aculo.us? That's crazy. It could be like I'm turning you on to psychedelic drugs

I might have visited that site once, and probably forgot about it. Thanks for reminding me about it.

It does require prototype, too. It works and it really ain't any harder than this:


I should do a tutorial for this, methinks.

Here's BlindUp/BlindDown in action:

http://206.251.36.107/simple/

all I wrote was the page source you see there. You will have to do some playing around to get it to work nicely with "onmouseover" maybe.

Thanks That was great help except it didn't work... the problem with that is that it works, but only inside of that div which is 97% wide and 40px wide... it's basically a bar at the bottom similar to Facebook or MySpace that holds the chat and online friends... what I need this pop-up menu for is the online friends thing...

Take a look through some of these

http://www.cssplay.co.uk/menus/

There are some that go up instead of down, like this one http://www.stunicholls.com/menu/skeleton_up.html

You could look into the underlying functions used; BlindUp is a combination effect using combinations of more basic things (like "Scale"), but you should be able to look through the effects.js and figure it out. Can't say I have tried myself tho, and I'm not sure how the script.aculo.us docs are in this regard.

My tactic with that stuff is to have just *one* div for the whole bar, and swap the contents since you are only going to view one drop down at a time; ie the same div goes up and comes down again with different content. But that's a stylistic choice; if you're trying to emulate something specific I guess you would have to find out how that is specifically done.



That second one looks good but I hope the guy responsible for the first one isn't also responsible for propagating this set of mistakes all over of the web, cause I see it everyday -- which just goes to show, you should really test stuff in more than one browser, etc:

What browser are you using. According to his info on that menu

@grinch2171: I didn't find any menus there that work this is getting to be frustrating.

None worked at all or they won't work with what you are wanting to do?

Check My Site... you will see the bar at the bottom... that is where I want that pop-up menu... I had one working there, but it would only show inside that bottom div and the top absolutely positioned div would cover the rest...

Z-INDEX wouldn't work then no matter what I would do, and so I gave up on it... this is becoming a little frustrating.

Thanks for your help so far guys!

That's not the stu nicholls one unless they are both by the same guy.

The screenshot is from firefox 3.0.4 Fedora Core 10-64.

I don't see it. Why do need a pop-up anyway? Your site seems fine.