drop down menu

[John Cook]

How would I go about setting up a drop down menu, like
those on the microsoft tool bars, that do not requirer a
go button?

 

[Steve Easton]

John it's easy to do.
However, when done without a Go button, people with disabilities that prevent them from using a
mouse, or people who prefer to use a key board to navigate will only be able to select the first
item in the drop down.

If knowing this you still want to do it, here is an example.

<p align="center"><b>Select a Site or Function: </b><select id="setit"
onChange="eval(setit.option[setit.selectedIndex].value)"></>
<option value="">Select one</option>
<option value="javascript:window.open('http://www.altavista.com')">AltaVista</option>
<option value="javascript:window.open('http://www.yahoo.com')">Yahoo</option>
<option value="javascript:window.open('http://www.google.com')">Google</option>
</select>

Make sure the line with onChange is all on one line, as it will probably wrap when I post.


--
Steve Easton
Microsoft MVP FrontPage
95isalive
This site is best viewed............
........................with a computer

 

[John]

I believe i type it in correctly:
The onChange line is all on one line.


<p align="center"><r><font color="#800000">Select a
Trip:</font> </b><select id="setit"
onChange="eval(setit.option
[setit.selectedIndex].value)"></><option value="">Select
one</option><option value="javascript:window.open
('http://home.houston.rr.com/wfcook//SenionPage1.htm')">Sen
ior Home Page</option><option value="javascript:window.open
('http://home.houston.rr.com/wfcook//history.htm')">Our
History</option><option value="javascript:window.open
('http://home.houston.rr.com/wfcook/members.htm')">Member
Listing</option>
</select>

However I get:
ERROR: 'setit.option is null or not an object
Code: O

What did I do wrong?

-----Original Message-----
John it's easy to do.
However, when done without a Go button, people with

disabilities that prevent them from using a

mouse, or people who prefer to use a key board to

navigate will only be able to select the first

item in the drop down.

If knowing this you still want to do it, here is an example.

<p align="center"><b>Select a Site or Function:

onChange="eval(setit.option

<option value="">Select one</option>
<option value="javascript:window.open

<option value="javascript:window.open

<option value="javascript:window.open

</select>

Make sure the line with onChange is all on one line, as

it will probably wrap when I post.

 

[Steve Easton]

John. There were some tag errors.
Try this one with the Go button, it's better anyway.

Also, copy and paste from here to notepad, and then from notepad to your page with the page in code
or html view.

<form>
<p align="center"><font color="#800000">Select a Trip:</font>
<select id="setit"></p>
<option value="">Select one</option>
<option value="javascript:window.open('http://home.houston.rr.com/wfcook/SeniorPage1.htm')">Senior
Home Page</option>
<option value="javascript:window.open('http://home.houston.rr.com/wfcook/history.htm')">Our
History</option>
<option value="javascript:window.open('http://home.houston.rr.com/wfcook/members.htm')">Member
Listing</option>
</select><input type="button" value="Go"
onclick="eval(setit.options[setit.selectedIndex].value)"></input></form>




--
Steve Easton
Microsoft MVP FrontPage
95isalive
This site is best viewed............
........................with a computer

I believe i type it in correctly:
The onChange line is all on one line.


<p align="center"><r><font color="#800000">Select a
Trip:</font> </b><select id="setit"
onChange="eval(setit.option
[setit.selectedIndex].value)"></><option value="">Select
one</option><option value="javascript:window.open
('http://home.houston.rr.com/wfcook//SenionPage1.htm')">Sen
ior Home Page</option><option value="javascript:window.open
('http://home.houston.rr.com/wfcook//history.htm')">Our
History</option><option value="javascript:window.open
('http://home.houston.rr.com/wfcook/members.htm')">Member
Listing</option>
</select>

However I get:
ERROR: 'setit.option is null or not an object
Code: O

What did I do wrong?

-----Original Message-----
John it's easy to do.
However, when done without a Go button, people with

disabilities that prevent them from using a

mouse, or people who prefer to use a key board to

navigate will only be able to select the first

item in the drop down.

If knowing this you still want to do it, here is an example.

<p align="center"><b>Select a Site or Function:

onChange="eval(setit.option

<option value="">Select one</option>
<option value="javascript:window.open

<option value="javascript:window.open

<option value="javascript:window.open

</select>

Make sure the line with onChange is all on one line, as

it will probably wrap when I post.

--
Steve Easton
Microsoft MVP FrontPage
95isalive
This site is best viewed............
........................with a computer




.

 

[John]

I already have one or two with go buttons.
I was hoping to eliminate the go button.

What tag errors did I have?
Is it possible for me to correct them?

Thanks

-----Original Message-----
John. There were some tag errors.
Try this one with the Go button, it's better anyway.

Also, copy and paste from here to notepad, and then from

notepad to your page with the page in code

or html view.

<form>
<p align="center"><font color="#800000">Select a

<select id="setit"></p>
<option value="">Select one</option>
<option value="javascript:window.open ('http://home.houston.rr.com/wfcook/SeniorPage1.htm')">Seni
or
Home Page</option>
<option value="javascript:window.open ('http://home.houston.rr.com/wfcook/history.htm')">Our
History</option>
<option value="javascript:window.open ('http://home.houston.rr.com/wfcook/members.htm')">Member
Listing</option>
</select><input type="button" value="Go"
onclick="eval(setit.options

--
Steve Easton
Microsoft MVP FrontPage
95isalive
This site is best viewed............
........................with a computer

I believe i type it in correctly:
The onChange line is all on one line.


<p align="center"><r><font color="#800000">Select a
Trip:</font> </b><select id="setit"
onChange="eval(setit.option
[setit.selectedIndex].value)"></><option value="">Select
one</option><option value="javascript:window.open
('http://home.houston.rr.com/wfcook//SenionPage1.htm')">Sen
ior Home Page</option><option value="javascript:window.open
('http://home.houston.rr.com/wfcook//history.htm')">Our
History</option><option value="javascript:window.open
('http://home.houston.rr.com/wfcook/members.htm')">Member
Listing</option>
</select>

However I get:
ERROR: 'setit.option is null or not an object
Code: O

What did I do wrong?

-----Original Message-----
John it's easy to do.
However, when done without a Go button, people with

disabilities that prevent them from using a

mouse, or people who prefer to use a key board to

navigate will only be able to select the first

item in the drop down.

If knowing this you still want to do it, here is an example.

<p align="center"><b>Select a Site or Function:

onChange="eval(setit.option

<option value="">Select one</option>
<option value="javascript:window.open

<option value="javascript:window.open

<option value="javascript:window.open

</select>

Make sure the line with onChange is all on one line, as

it will probably wrap when I post.

--
Steve Easton
Microsoft MVP FrontPage
95isalive
This site is best viewed............
........................with a computer

How would I go about setting up a drop down menu, like
those on the microsoft tool bars, that do not

requirer
a

go button?


.

.

 

[Jon Spivey]

Steve,
Thats going to fail on NN4 - we can't address a form element by ID. I'd do
it like this

With GO button
<form>
<select name="box">
<option value="">Choose</option>
<option value="http://www.ibm.com">IBM</option>
...etc
</select>
<input
onclick="if(this.form.box.selectedIndex>0)location.href=this.form.box.option
s[this.form.box.options.selectedIndex].value;" type="button" value="Go">
</form>

Without GO button
<form>
<select name="box"
onchange="if(this.options.selectedIndex>0)location.href=this.options[this.op
tions.selectedIndex].value">
<option value="">Choose</option>
<option value="http://www.ibm.com">IBM</option>
....etc
</select>
</form>

Cheers,
Jon
Microsoft MVP

John. There were some tag errors.
Try this one with the Go button, it's better anyway.

Also, copy and paste from here to notepad, and then from notepad to your page with the page in code
or html view.

<form>
<p align="center"><font color="#800000">Select a Trip:</font>
<select id="setit"></p>
<option value="">Select one</option>
<option value="javascript:window.open('http://home.houston.rr.com/wfcook/SeniorPage1
..htm')">Senior
Home Page</option>
<option value="javascript:window.open('http://home.houston.rr.com/wfcook/history.htm
')">Our

History</option>
<option

value="javascript:window.open('http://home.houston.rr.com/wfcook/members.htm
')">Member
Listing</option>
</select><input type="button" value="Go"
onclick="eval(setit.options[setit.selectedIndex].value)"></input></form>




--
Steve Easton
Microsoft MVP FrontPage
95isalive
This site is best viewed............
.......................with a computer

I believe i type it in correctly:
The onChange line is all on one line.


<p align="center"><r><font color="#800000">Select a
Trip:</font> </b><select id="setit"
onChange="eval(setit.option
[setit.selectedIndex].value)"></><option value="">Select
one</option><option value="javascript:window.open
('http://home.houston.rr.com/wfcook//SenionPage1.htm')">Sen
ior Home Page</option><option value="javascript:window.open
('http://home.houston.rr.com/wfcook//history.htm')">Our
History</option><option value="javascript:window.open
('http://home.houston.rr.com/wfcook/members.htm')">Member
Listing</option>
</select>

However I get:
ERROR: 'setit.option is null or not an object
Code: O

What did I do wrong?

-----Original Message-----
John it's easy to do.
However, when done without a Go button, people with

disabilities that prevent them from using a

mouse, or people who prefer to use a key board to

navigate will only be able to select the first

item in the drop down.

If knowing this you still want to do it, here is an example.

<p align="center"><b>Select a Site or Function:

onChange="eval(setit.option

<option value="">Select one</option>
<option value="javascript:window.open

<option value="javascript:window.open

<option value="javascript:window.open

</select>

Make sure the line with onChange is all on one line, as

it will probably wrap when I post.

--
Steve Easton
Microsoft MVP FrontPage
95isalive
This site is best viewed............
........................with a computer

How would I go about setting up a drop down menu, like
those on the microsoft tool bars, that do not requirer a
go button?


.

 

[MD Websunlimited]

Hi John,

A quick, an inexpensive, way to produce these is with J-Bots Drop Down Jump Menu

What's your time worth?

 

[John]

Thank You Jon Spivey

Works Great!

Is there away to change the color of the box with the
arror in it from gray to something else?

I would prefer someting to tie in more with the theme.

Thanks Again.

-----Original Message-----
Steve,
Thats going to fail on NN4 - we can't address a form element by ID. I'd do
it like this

With GO button
<form>
<select name="box">
<option value="">Choose</option>
<option value="http://www.ibm.com">IBM</option>
...etc
</select>
<input
onclick="if(this.form.box.selectedIndex>0) location.href=this.form.box.option
s[this.form.box.options.selectedIndex].value;" type="button" value="Go">
</form>

Without GO button
<form>
<select name="box"
onchange="if(this.options.selectedIndex>0) location.href=this.options[this.op
tions.selectedIndex].value">
<option value="">Choose</option>
<option value="http://www.ibm.com">IBM</option>
....etc
</select>
</form>

Cheers,
Jon
Microsoft MVP

John. There were some tag errors.
Try this one with the Go button, it's better anyway.

Also, copy and paste from here to notepad, and then

from notepad to your
page with the page in code

or html view.

<form>
<p align="center"><font color="#800000">Select a

<select id="setit"></p>
<option value="">Select one</option>
<option value="javascript:window.open

('http://home.houston.rr.com/wfcook/SeniorPage1

..htm')">Senior
Home Page</option>
<option value="javascript:window.open

('http://home.houston.rr.com/wfcook/history.htm

')">Our
value="javascript:window.open

('http://home.houston.rr.com/wfcook/members.htm

')">Member
Listing</option>
</select><input type="button" value="Go"
onclick="eval(setit.options

--
Steve Easton
Microsoft MVP FrontPage
95isalive
This site is best viewed............
.......................with a computer

I believe i type it in correctly:
The onChange line is all on one line.


<p align="center"><r><font color="#800000">Select a
Trip:</font> </b><select id="setit"
onChange="eval(setit.option
[setit.selectedIndex].value)"></><option value="">Select
one</option><option value="javascript:window.open
('http://home.houston.rr.com/wfcook//SenionPage1.htm')">Sen
ior Home Page</option><option value="javascript:window.open
('http://home.houston.rr.com/wfcook//history.htm')">Our
History</option><option value="javascript:window.open
('http://home.houston.rr.com/wfcook/members.htm')">Member
Listing</option>
</select>

However I get:
ERROR: 'setit.option is null or not an object
Code: O

What did I do wrong?


-----Original Message-----
John it's easy to do.
However, when done without a Go button, people with
disabilities that prevent them from using a
mouse, or people who prefer to use a key board to
navigate will only be able to select the first
item in the drop down.

If knowing this you still want to do it, here is an
example.

<p align="center"><b>Select a Site or Function:
</b><select id="setit"
onChange="eval(setit.option
[setit.selectedIndex].value)"></>
<option value="">Select one</option>
<option value="javascript:window.open
('http://www.altavista.com')">AltaVista</option>
<option value="javascript:window.open
('http://www.yahoo.com')">Yahoo</option>
<option value="javascript:window.open
('http://www.google.com')">Google</option>
</select>

Make sure the line with onChange is all on one line, as
it will probably wrap when I post.


--
Steve Easton
Microsoft MVP FrontPage
95isalive
This site is best viewed............
........................with a computer

in message
How would I go about setting up a drop down menu, like
those on the microsoft tool bars, that do not requirer
a
go button?


.

.

 

[MD Websunlimited]

John,

Use a class id in the select tag and then use CSS to set font, color, border etc.

Note: J-Bots automatically inserts the class id and a selector in the page that can be referenced by FP | Format | Style

What's your time worth John?



--
Mike -- FrontPage MVP '97-'02
http://www.websunlimited.com
FrontPage Add-ins Since '97 FP 2003 / 2002 / 2000 Compatible

Thank You Jon Spivey

Works Great!

Is there away to change the color of the box with the
arror in it from gray to something else?

I would prefer someting to tie in more with the theme.

Thanks Again.

-----Original Message-----
Steve,
Thats going to fail on NN4 - we can't address a form element by ID. I'd do
it like this

With GO button
<form>
<select name="box">
<option value="">Choose</option>
<option value="http://www.ibm.com">IBM</option>
...etc
</select>
<input
onclick="if(this.form.box.selectedIndex>0) location.href=this.form.box.option
s[this.form.box.options.selectedIndex].value;" type="button" value="Go">
</form>

Without GO button
<form>
<select name="box"
onchange="if(this.options.selectedIndex>0) location.href=this.options[this.op
tions.selectedIndex].value">
<option value="">Choose</option>
<option value="http://www.ibm.com">IBM</option>
....etc
</select>
</form>

Cheers,
Jon
Microsoft MVP

John. There were some tag errors.
Try this one with the Go button, it's better anyway.

Also, copy and paste from here to notepad, and then

from notepad to your
page with the page in code

or html view.

<form>
<p align="center"><font color="#800000">Select a

<select id="setit"></p>
<option value="">Select one</option>
<option value="javascript:window.open

('http://home.houston.rr.com/wfcook/SeniorPage1

..htm')">Senior
Home Page</option>
<option value="javascript:window.open

('http://home.houston.rr.com/wfcook/history.htm

')">Our
value="javascript:window.open

('http://home.houston.rr.com/wfcook/members.htm

')">Member
Listing</option>
</select><input type="button" value="Go"
onclick="eval(setit.options

--
Steve Easton
Microsoft MVP FrontPage
95isalive
This site is best viewed............
.......................with a computer

I believe i type it in correctly:
The onChange line is all on one line.


<p align="center"><r><font color="#800000">Select a
Trip:</font> </b><select id="setit"
onChange="eval(setit.option
[setit.selectedIndex].value)"></><option value="">Select
one</option><option value="javascript:window.open
('http://home.houston.rr.com/wfcook//SenionPage1.htm')">Sen
ior Home Page</option><option value="javascript:window.open
('http://home.houston.rr.com/wfcook//history.htm')">Our
History</option><option value="javascript:window.open
('http://home.houston.rr.com/wfcook/members.htm')">Member
Listing</option>
</select>

However I get:
ERROR: 'setit.option is null or not an object
Code: O

What did I do wrong?


-----Original Message-----
John it's easy to do.
However, when done without a Go button, people with
disabilities that prevent them from using a
mouse, or people who prefer to use a key board to
navigate will only be able to select the first
item in the drop down.

If knowing this you still want to do it, here is an
example.

<p align="center"><b>Select a Site or Function:
</b><select id="setit"
onChange="eval(setit.option
[setit.selectedIndex].value)"></>
<option value="">Select one</option>
<option value="javascript:window.open
('http://www.altavista.com')">AltaVista</option>
<option value="javascript:window.open
('http://www.yahoo.com')">Yahoo</option>
<option value="javascript:window.open
('http://www.google.com')">Google</option>
</select>

Make sure the line with onChange is all on one line, as
it will probably wrap when I post.


--
Steve Easton
Microsoft MVP FrontPage
95isalive
This site is best viewed............
........................with a computer

in message
How would I go about setting up a drop down menu, like
those on the microsoft tool bars, that do not requirer
a
go button?


.

.

 

[Don]

Look here and see if that's what you want...
http://www.xmas-i-am.com/drop-down_box_color.htm

HTH

Don
EEE
===========
| Thank You Jon Spivey
|
| Works Great!
|
| Is there away to change the color of the box with the
| arror in it from gray to something else?
|
| I would prefer someting to tie in more with the theme.
|
| Thanks Again.
|
|
| >-----Original Message-----
| >Steve,
| >Thats going to fail on NN4 - we can't address a form
| element by ID. I'd do
| >it like this
| >
| >With GO button
| ><form>
| ><select name="box">
| ><option value="">Choose</option>
| ><option value="http://www.ibm.com">IBM</option>
| >...etc
| ></select>
| ><input
| >onclick="if(this.form.box.selectedIndex>0)
| location.href=this.form.box.option
| >s[this.form.box.options.selectedIndex].value;"
| type="button" value="Go">
| ></form>
| >
| >Without GO button
| ><form>
| ><select name="box"
| >onchange="if(this.options.selectedIndex>0)
| location.href=this.options[this.op
| >tions.selectedIndex].value">
| ><option value="">Choose</option>
| ><option value="http://www.ibm.com">IBM</option>
| >....etc
| ></select>
| ></form>
| >
| >Cheers,
| >Jon
| >Microsoft MVP
| >
| >| >> John. There were some tag errors.
| >> Try this one with the Go button, it's better anyway.
| >>
| >> Also, copy and paste from here to notepad, and then
| from notepad to your
| >page with the page in code
| >> or html view.
| >>
| >> <form>
| >> <p align="center"><font color="#800000">Select a
| Trip:</font>
| >> <select id="setit"></p>
| >> <option value="">Select one</option>
| >> <option
| >value="javascript:window.open
| ('http://home.houston.rr.com/wfcook/SeniorPage1
| >..htm')">Senior
| >> Home Page</option>
| >> <option
| >value="javascript:window.open
| ('http://home.houston.rr.com/wfcook/history.htm
| >')">Our
| >> History</option>
| >> <option
| >value="javascript:window.open
| ('http://home.houston.rr.com/wfcook/members.htm
| >')">Member
| >> Listing</option>
| >> </select><input type="button" value="Go"
| >> onclick="eval(setit.options
| [setit.selectedIndex].value)"></input></form>
| >>
| >>
| >>
| >>
| >> --
| >> Steve Easton
| >> Microsoft MVP FrontPage
| >> 95isalive
| >> This site is best viewed............
| >> .......................with a computer
| >>
| message
| >> | >> > I believe i type it in correctly:
| >> > The onChange line is all on one line.
| >> >
| >> >
| >> > <p align="center"><r><font color="#800000">Select a
| >> > Trip:</font> </b><select id="setit"
| >> > onChange="eval(setit.option
| >> > [setit.selectedIndex].value)"></><option
| value="">Select
| >> > one</option><option value="javascript:window.open
| >> >
| ('http://home.houston.rr.com/wfcook//SenionPage1.htm')">Sen
| >> > ior Home Page</option><option
| value="javascript:window.open
| >> >
| ('http://home.houston.rr.com/wfcook//history.htm')">Our
| >> > History</option><option value="javascript:window.open
| >> >
| ('http://home.houston.rr.com/wfcook/members.htm')">Member
| >> > Listing</option>
| >> > </select>
| >> >
| >> > However I get:
| >> > ERROR: 'setit.option is null or not an object
| >> > Code: O
| >> >
| >> > What did I do wrong?
| >> >
| >> >
| >> > >-----Original Message-----
| >> > >John it's easy to do.
| >> > >However, when done without a Go button, people with
| >> > disabilities that prevent them from using a
| >> > >mouse, or people who prefer to use a key board to
| >> > navigate will only be able to select the first
| >> > >item in the drop down.
| >> > >
| >> > >If knowing this you still want to do it, here is an
| >> > example.
| >> > >
| >> > ><p align="center"><b>Select a Site or Function:
| >> > </b><select id="setit"
| >> > >onChange="eval(setit.option
| >> > [setit.selectedIndex].value)"></>
| >> > > <option value="">Select one</option>
| >> > > <option value="javascript:window.open
| >> > ('http://www.altavista.com')">AltaVista</option>
| >> > > <option value="javascript:window.open
| >> > ('http://www.yahoo.com')">Yahoo</option>
| >> > > <option value="javascript:window.open
| >> > ('http://www.google.com')">Google</option>
| >> > > </select>
| >> > >
| >> > >Make sure the line with onChange is all on one line,
| as
| >> > it will probably wrap when I post.
| >> > >
| >> > >
| >> > >--
| >> > >Steve Easton
| >> > >Microsoft MVP FrontPage
| >> > >95isalive
| >> > >This site is best viewed............
| >> > >........................with a computer
| >> > >
| >> > >"John Cook" <[email protected]>
| wrote
| >> > in message
| >> > >| >> > >> How would I go about setting up a drop down menu,
| like
| >> > >> those on the microsoft tool bars, that do not
| requirer
| >> > a
| >> > >> go button?
| >> > >
| >> > >
| >> > >.
| >> > >
| >>
| >>
| >
| >
| >.
| >