...

View Full Version : Hyperlink that open a menu?



lebronletchev
08-16-2007, 04:34 PM
Hi,

Can I open a short menu (one column and half dozen lines) when the hyperlink is selected by the user instead other link?

Thank you

Lebron

Daemonspyre
08-16-2007, 08:40 PM
You mean similar to a DHTML menu?

Of course, but it is done with JavaScript.

You need to use the onclick property of the anchor tag to do so.

FOR EXAMPLE:

<a href="#" onclick="javascript:openMenuItem(3);">Menu Item 3</a>

If this isn't what you are looking for, could you please explain what you need a little better or provide an example?

lebronletchev
08-17-2007, 12:20 PM
So so!

Hi,

Rewriting my question after your example...

How to populate dhtml menu from MSSQL/MSACCESS database when the user presses the mouse button over a hyperlink (instead open other link) using JAVASCRIPT?

Example
----------
Signed <a href="#" onclick="javascript:openMenu;">pitcher</a> Madison Bumgarner and <a href="#" onclick="javascript:openMenu;">outfielder</a> Wendell Fairley.

Show a "pop up menu": for example:

American league
European league
Japan league

The user finally presses the mouse and enter in one of that options. The menu otions are storaged into a database (MSSQL or MSAccess).It doensīt matter!

Thank you for any helpful

Lebron

Daemonspyre
08-17-2007, 02:17 PM
Ah, I get where you are going.

That kind of communication is done either with hidden DIV tags, which are displayed when the openMenu() function is called, or by AJAX calls that basically do the same thing, but are slightly more difficult to employ.

Which would you prefer?

lebronletchev
08-18-2007, 03:39 PM
Hummm...

The right name I want is "contextmenu" right?

I would prefer the most easy solution... I donīt know nothing about AJAX.

Thanks

Lebron

Daemonspyre
08-18-2007, 09:54 PM
"ContextMenu" is the right term, but most people associate context menus with the "Right Click".

DIV tags are the easiest way to do this.

In your HTML, use ASP to pull your "context menu" content from the database. Then create DIV tags with a <div style="display: none;"></div>. Your menu items will open these special DIV tags based on 1) your JS, and 2) the value, passed by the JS to the DIV tag.

EXAMPLE:


<html>

<head>
<title>Click here to view a hidden DIV</title>
<script language="javascript">
function showDiv(int) {
document.getElementById(int).style.display = '';
}
</script>
</head>

<body>
<a href="#" onclick="javascript:showDiv('hiddenDIV');">Click here to view a hidden DIV tag</a><br />

<div id="hiddenDIV" style="position: absolute; display: none; left: 200px; top: 150px; border: 1px solid #000000;">
<span style="font-weight: bold; font-family: Verdana; margin-left: 8px;">Content Header</span>
<div id="records">
Here is where your ASP records go<br />
</div>
</div>
</body>

</html>


Is this the only way to do it? Of course not. I use Scriptaculous (http://script.aculo.us) a lot, especially for "pretty". I think that you will find them a great help in making sure your menus get seen in a "pretty" way.

Let me know if you need any more help.

lebronletchev
08-20-2007, 09:14 AM
Well, I am trying it exactly now!

Here it points to the same record: (record #1). In other words, it shown just the contents of record #1.

<div id="records">
Here is where your ASP records go<br />
</div>


I did in this way:




<%do until rs2.EOF%>
<%IF NOT RS2.EOF THEN%>

<a href="#" onclick="javascript:showDiv('hiddenDIV');"><%Response.Write RS2.FIELDS("keywords")%></a><br>
<div id="hiddenDIV" style="position: absolute; display: none; left: 200px; top: 150px; border: 1px solid #000000;">
<span style="font-weight: bold; font-family: Verdana; margin-left: 8px;">Content Header</span>
<div id="records"><%Response.Write RS2.FIELDS("test")%> <br />
<br />
</div>
</div>
</th>

</tr>


<%rs2.MoveNext%>

<%END IF%>

As you see there is a "loop" but it donīt moves down nor up. However It shown the content of RS2.FIELDS("test"), although just the first record!

Thank you again

lebron

Daemonspyre
08-20-2007, 01:25 PM
You need to do 2 loops, not just one.

For the second loop set, do another rs lookup for just the "test" fields.


<div id="records">
<%
rs3.open "SELECT test FROM your_table WHERE test IS NULL", conn
if not rs3.eof
rs3.movefirst
while not rs3.eof
Response.Write RS3("test") & "<br />"
rs3.movenext
wend
end if
rs3.close
%>
<br />
</div>


Loops within loops aren't the best for memory management, but since you are only reading info from the database, it shouldn't slow your site any.

lebronletchev
08-21-2007, 10:48 AM
Well, the script works fine!

Could you just tell me as I release the "ContentHeader". For example 50 seconds ou if move up the mouse...

Now based on you script I hope do "rain" speaking metaphorically. In other terms "extract gold from an abandoned mine".

Thank you again.

Lebron

Daemonspyre
08-21-2007, 01:07 PM
That would be done with either a setTimeout() or an onmouseout() feature.

The setTimeout would be done in your original JS call:


function showDiv(int) {
window.setTimeout(this, 5000);
document.getElementById(int).style.display = '';
}

//NOTE This is untested and may not work.

The other option is that you can use onmouseout, which is done in the div tag.

<div id="hiddenDIV" onmouseout="this.style.display='none';" style="position: absolute; display: none; left: 200px; top: 150px; border: 1px solid #000000;">

lebronletchev
08-24-2007, 12:17 PM
Thank you so much!

The script works fine. No problems.

Best

lebron



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum