Page 1 of 1

Can you recommend a good free Javascript pop-up menu?

Posted: Wed Oct 08, 2003 6:09 am
by JayBird
Im looking for a free pop-up menu script.

I already have one but i doesn't have a particular feature i am looking for

I am looking for one that can position the menus relative to an image.

Thanks

Mark

Posted: Wed Oct 08, 2003 6:32 am
by Nay
Do you mean something like DeviantArt's one? Like you hover on an image and a menu appears, links inside are clickable.

-Nay

Posted: Wed Oct 08, 2003 6:41 am
by JayBird
yup

Posted: Wed Oct 08, 2003 6:57 am
by Nay
mMm, I've been wanting one of those myself. Hold on, I'll make one up for both of us :D.

-Nay

Posted: Wed Oct 08, 2003 7:04 am
by Nay

Code: Select all

<script language="javascript" type="text/javascript">
<!--

function display(text) &#123;
var x = window.event.x;
var y = window.event.y;
document.getElementById("info").style.left = x;
document.getElementById("info").style.top = y;
document.getElementById("info").innerHTML = text;
document.getElementById("info").style.display = "block";
&#125;

function hide() &#123;
document.getElementById("info").style.display = "none";
&#125;

//-->
</script>

<div id="info" style="top:0;left:0;position:absolute;display:none;width:100;height:50;background:#cccccc;border:1 solid black"></div>

<br /><br /><br /><br /><br /><br />
<p onMouseOver="display('nay rules!');" onMouseOut="hide()">
who is nay?
</p>
That's how I did it. It works for me in IE 6.0, but nothing show's up in Mozilla though :(.

-Nay

ps: Not so good but it's free :D. So it matches one of yout request :D.

Posted: Wed Oct 08, 2003 3:01 pm
by m3rajk
that's because you're using some ie added functions. try finging the emca (i think that's the name) equivalent that both ie and mozilla recognize.. opps. that's right. ie doesn't care about standards, and only mozilla conforms to those standards

Posted: Wed Oct 08, 2003 4:07 pm
by scorphus
This work in both IE and Mozilla. Not PHP but let us benefit from the source coloring for Javascript too:

Code: Select all

<script language="javascript" type="text/javascript">
<!--
// First we need to know what is the user's browser
var isExplorer4p = (navigator.appName == "Microsoft Internet Explorer" && navigator.appVersion.substring(0,1) >= "4");
var isNetscape5p = (navigator.appName == "Netscape" && navigator.appVersion.substring(0,1) >= "5");

function display (text, event) { // Mozilla: need to pass the event as function argument
	var x, y;
	if (isNetscape5p) {
		x = event.layerX;
		y = event.layerY;
	}
	else {
		x = window.event.x;
		y = window.event.y;
	}
	document.getElementById("info").style.left = x;
	document.getElementById("info").style.top = y;
	document.getElementById("info").innerHTML = text;
	document.getElementById("info").style.display = "block";
	return;
}

function hide () {
	document.getElementById("info").style.display = "none";
	return;
}

//-->
</script>

<div id="info" style="top:0;left:0;position:absolute;display:none;width:100;height:50;background:#cccccc;border:1 solid black"></div>

<br /><br /><br /><br /><br /><br />
<p onMouseOver="display('nay rules!', event);" onMouseOut="hide()">
who is nay?
</p>
Regards,
Scorphus.

Posted: Wed Oct 08, 2003 4:17 pm
by Unipus
By far the best one I've ever seen is ypSlideoutMenus from http://www.youngpup.com. Aaron's also a real nice guy, and although he's pretty busy, he'll help you out if your question is more than very basic.

Posted: Wed Oct 08, 2003 4:17 pm
by Unipus
Oh, I guess I should mention the obvious: the source is available for download from the site, which also has examples of its use.

Posted: Thu Oct 09, 2003 3:08 am
by JayBird
Unipus: Did you give the correct address for that site?

The one you gave has nothing there?

Mark

Posted: Thu Oct 09, 2003 6:37 pm
by Unipus
Oh, oops... in included the period as part of the URL. Hey, and also it's .net and not .com! I'm on a roll today (or yesterday, rather)!

http://www.youngpup.net

Sorry.

Posted: Thu Oct 09, 2003 6:55 pm
by Vincent Puglia
Hi,

if you are still looking for one: http://www.brainjar.com -- Revenge of the Menu Bar -- while the demo shows text, you can replace the text with an image. You will also have to modify the main div's height.

Vinny