...

View Full Version : Links jump to anchors within a Menu



eeeeee12
12-06-2004, 04:09 PM
Hello Guys
I am trying to make a page with links listed alphabetically within a menu. Can I make the letters/links jump to an anchor within the menu. I know this is not very clear so I have made a test page to show what I mean. Many thanks.
Chris
http://chtremb22.i8.com/TESTmenu.htm

Bobo
12-06-2004, 06:05 PM
do you mean to do
http: // www. link .com#anchor
?

Willy Duitt
12-06-2004, 06:29 PM
Try searching for: Type Ahead Option Menu

eeeeee12
12-06-2004, 06:30 PM
Hello Bobo
Sorry I don't know what you mean. I am trying to get the letters on top
to jump to their assigned letters within the menu (please see example). A to A; B to B ... I hope this is clear enough. Thanks.
Chris

aifilaw
12-06-2004, 07:08 PM
here's one way to do this:

<form name="form1">
<p><a href="javascript:" onclick="A.selected=true">A</a>
<a href="javascript:" onclick="B.selected=true">B</a>
<a href="javascript:" onclick="C.selected=true">C</a></p>
<p>
<select name="menu1" size="10" onChange="MM_jumpMenu('parent',this,0)">
<option id="A"></a>A-</option>
<option value="http://www.yahoo.com/">Yahoo</option>
<option value="http://www.google.com/">Google</option>
<option value="http://www.hotmail.com/">Hotmail</option>
<option value="http://www.tek-tips.com">Tek-tips</option>
<option>unnamed5</option>
<option>unnamed6</option>
<option>unnamed7</option>
<option>unnamed8</option>
<option id="B"></a>B-</option>
<option value="http://www.mail.com/">Mail</option>
<option value="http://www.ask.com/">Ask</option>
<option>unnamed12</option>
<option>unnamed13</option>
<option>unnamed14</option>
<option id="C"></a>C-</option>
<option value="http://www.lycos.com/">Lycos</option>
<option value="http://www.myway.com/">Myway</option>
<option>unnamed17</option>
<option>unnamed18</option>
<option>unnamed19</option>
<option>unnamed20</option>
</select>
</p>
</form>

Willy Duitt
12-06-2004, 07:49 PM
The above at best will be IE only and not cross browser compatable...
You can also try this... Should be cross browser and not reguire changes to the option menu...



<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>Untitled Document</title>
<script language="JavaScript" type="text/JavaScript">
<!--//
function MM_jumpMenu(targ,selObj,restore){ //v3.0
eval(targ+".location='"+selObj.options[selObj.selectedIndex].value+"'");
if (restore) selObj.selectedIndex=0;
}

function jumpTo(anchor){
var menuItem = (/#(\w)$/).test(anchor);
for(var i=0; i<document.forms['form1']['menu1'].options.length; i++){
var option = document.forms['form1']['menu1'].options[i];
if(new RegExp('^'+RegExp.$1+'-\$','i').test(option.text)){
option.selected = true;
document.forms['form1']['menu1'].focus();
} else{ option.selected = false; }
} return false;
}
//-->
</script>
</head>

<body>
<a href="#A" onclick="return jumpTo(this.href)">A</a>
<a href="#B" onclick="return jumpTo(this.href)">B</a>
<a href="#C" onclick="return jumpTo(this.href)">C</a>
<form name="form1">
<select name="menu1" size="10" onchange="MM_jumpMenu('parent',this,0)">
<option selected>A-</option>
<option value="http://www.yahoo.com/">Yahoo</option>
<option value="http://www.google.com/">Google</option>
<option value="http://www.hotmail.com/">Hotmail</option>
<option value="http://www.tek-tips.com">Tek-tips</option>
<option>unnamed5</option>
<option>unnamed6</option>
<option>unnamed7</option>
<option>unnamed8</option>
<option>B-</option>
<option value="http://www.mail.com/">Mail</option>
<option value="http://www.ask.com/">Ask</option>
<option>unnamed12</option>
<option>unnamed13</option>
<option>unnamed14</option>
<option>C-</option>
<option value="http://www.lycos.com/">Lycos</option>
<option value="http://www.myway.com/">Myway</option>
<option>unnamed17</option>
<option>unnamed18</option>
<option>unnamed19</option>
<option>unnamed20</option>
</select>
</form>
</body>
</html>


.....Willy

eeeeee12
12-06-2004, 08:21 PM
Hey Guys
THANKS. This is great. :thumbsup:
Many thanks.
C :D



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum