sample05.js

function PopUpMenu() {
if (document.getElementById("menu01").style.visibility=="visible") {
document.getElementById("menu01").style.visibility="hidden";
} else {
document.getElementById("menu01").style.visibility="visible";
}
}

function ClearField() {
document.getElementById("search").value = "";
}

function HideMenu() {
document.getElementById("menu01").style.visibility="hidden";
}

function SelectMenuItem(text) {
document.getElementById("search").value = text;
}

sample05.css

* {
padding: 0;
margin: 0;
}

body {
font-size: 12px;
margin: 10px;
}

form {
margin: 10px 0px;
}

div.stf {
position: relative;
height: 20px;
}

input#search {
position: absolute;
left: 20px;
width: 144px;
height: 18px;
border-width: 1px;
border-style: solid;
border-color: #7c7c7c #c3c3c3 #dddddd;
line-height: 18px;
}

span.menu-button {
display: block;
position: absolute;
top: 0px;
left: 0px;
text-indent: -1024px;
overflow: hidden;
background: url(../images/arrow_6x6.png) 50% 50% no-repeat;
_background: url(../images/arrow_6x6.gif) 50% 50% no-repeat;/*for IE6.0*/
width: 20px;
height: 20px;
}

span.clear-button {
display: block;
position: absolute;
top: 0px;
left: 164px;
text-indent: -1024px;
overflow: hidden;
background: url(../images/clear_10x10.gif) 50% 50% no-repeat;
width: 20px;
height: 20px;
}

span.clear-button:active {
background: url(../images/clear_active_10x10.gif) 50% 50% no-repeat;
}

div.pop-up {
padding: 0px 10px 10px 0px;
background: url(../images/shadow_512x512.png) 100% 100%;
_background: url(../images/shadow_512x512.gif) 100% 100%;/*for IE6.0*/
position: absolute;
top: 20px;
left: 0px;
_width: 150px;
visibility: hidden;
opacity: 0.9;
}

div.pop-up ul {
font-size: 11px;
line-height: 150%;
background: #eeeeee url(../images/background_12x12.gif);
padding: 3px 0px;
border-top: solid #c3c3c3 1px;
border-left: solid #c3c3c3 1px;
}

div.pop-up ul li {
list-style: none;
height: 1.5em;
}

div.pop-up ul li span.menu-title {
display: block;
color: #7f7f7f;
padding: 0px 20px;
}

div.pop-up ul li a {
display: block;
color: #000000;
text-decoration: none;
padding: 0px 20px;
height: 1.5em;
}

div.pop-up ul li a:hover {
color: #ffffff;
background: #2b6bce;
}