Drop down boxes in HTML editor

Drop down boxes in HTML editor

by Natalie Andrews -
Number of replies: 1

Hey,

I'm pretty new to all this so apologies in advance if i'm just being a bit dozey with the code but...

I've created a web page resource on our moodle with hyperlinks to the other web pages we have created. Instead of listing the other pages as hyperlinks I would like to put in a drop down box containing the links to the other pages but I cannot get it to work. I have got as far as the drop down box and that works fine, the problem I have is the linking bit. This is the code I am using at the moment (it may be a million miles away from what it should be!):

<select name="Lessons">

<option value=<a href "http://www.henrycort.org/curric/mod/resource/view.php?id=886"</a>Lesson 1</option>

<option value="Lesson 2">Lesson 2</option>

<option value="Lesson 3">Lesson 3</option>

<option value="Lesson 4">Lesson 4</option>

((Obviously the 1st line is what I have tried to get the link working and the other 3 are the original code which does the drop down box...))

Any suggestions??

Natalie

Average of ratings: -
In reply to Natalie Andrews

Re: Drop down boxes in HTML editor

by jon catuccio -
I have used CSS but you have to paste the entire code in each time you edit (variations of this at CSSplay):

<style type="text/css">
/* ================================================================
This copyright notice must be untouched at all times.

The original version of this stylesheet and the associated (x)html
is available at http://www.cssplay.co.uk/menus/drop_definition4.html
Copyright (c) 2005-2007 Stu Nicholls. All rights reserved.
This stylesheet and the assocaited (x)html may be modified in any
way to fit your requirements.
=================================================================== */
#menu {list-style-type:none; margin:40px 0 200px 15px; padding:0;}

#menu li {float:left; padding:0; margin:0 1px 0 0; position:relative; width:150px; height:1px; z-index:100;}
#menu li a, #menu li a:visited {text-decoration:none;}

#menu dl {position:absolute; top:0; left:0; width: 150px; margin: 0; padding: 0; background: transparent url(transparency.gif);}
#menu dt {background: #b2ab9b; margin:0;font-size: 1.1em; border-bottom:1px solid #fff; width:150px; float:left;}
#menu dd {display:none; background: transparent; border-bottom:1px solid #cce; clear:left; margin:0; padding:0; color: #fff; font-size: 1em; text-align:left;}

#menu dt a, #menu dt a:visited {display:block; color:#ff8; padding: 5px 5px 5px 20px; width:125px;}
#menu dd a, #menu dd a:visited {background:#b2ab9b; color:#ff8; text-decoration:none; display:block; padding:4px 5px 4px 20px; width:150px;}

#menu li a:hover {border:0;}

#menu li:hover dd, #menu li a:hover dd {display:block;}
#menu li:hover dl, #menu li a:hover dl {width:150px; border-bottom:15px solid #e2dfa8;}
#menu li:hover dt a, #menu li a:hover dt a, #menu dd a:hover {background: #e2dfa8; color:#534;}


</style>


<ul id="menu">
<li> <!--[if lte IE 6]><a href="#nogo"><table><tr><td><![endif]--> <dl> <dt><a href="menu/index.html">Modules</a></dt>
<dd><a title="Orientation to Project Based Learning in the Digital Age" href="http://tools.fcit.usf.edu/moodle/course/view.php?id=6">Orientation</a></dd>
<dd><a title="Introduction to Project Based learning" href="http://tools.fcit.usf.edu/moodle/course/view.php?id=9">One</a></dd>
<dd><a title=" Implementing Project Based Learning in curriculum" href="http://tools.fcit.usf.edu/moodle/course/view.php?id=10">Two</a></dd>
<dd><a title=" Idea mapping and thoughtful organization" href="http://tools.fcit.usf.edu/moodle/course/view.php?id=11">Three</a></dd>
<dd><a title="Classroom management in the digital classroom. How to manage and organize your students around one computer in the room, or when working in a lab. You will find some practical suggestions when working on assignments and using a project based learning approach." href="http://tools.fcit.usf.edu/moodle/course/view.php?id=12">Four</a></dd>
<dd><a title="Copyright Issues in the digital classroom" href="http://tools.fcit.usf.edu/moodle/course/view.php?id=13">Five</a></dd>
<dd><a title="Digital tools in the classroom" href="http://tools.fcit.usf.edu/moodle/course/view.php?id=14">Six</a></dd>
<dd><a title="Digital media in the classroom (pt. II)" href="http://tools.fcit.usf.edu/moodle/course/view.php?id=15">Seven</a></dd>
<dd><a title=" Digital Reflections and assessment" href="http://tools.fcit.usf.edu/moodle/course/view.php?id=16">Eight</a></dd>
<dd><a title="Creating project Reflections for dissemination" href="http://tools.fcit.usf.edu/moodle/course/view.php?id=17">Nine</a></dd>
<dd><a title="Project reflection, assessment and evaluation" href="http://tools.fcit.usf.edu/moodle/course/view.php?id=18">Ten</a></dd> </dl> <!--[if lte IE 6]></td></tr></table></a><![endif]--> </li>
</ul>

Jon
Average of ratings: -