Avatar billede kickmrb Nybegynder
06. februar 2003 - 08:22 Der er 4 kommentarer og
1 løsning

Drop Down look

Hej Eksperter

Jeg har lånt denne drop down box.

<html>
<head>

<style>
select {
font-family: verdana, helvetica, sans-serif;
color: #333333;
font-size: 9px;
background-color: #888888

}

}

.inputbutton {
font-family: verdana, helvetica, sans-serif;
color: #333333;
font-size: 9px;
background-color: #888888
}

</style>
<SCRIPT LANGUAGE="JavaScript">
<!-- Begin
site = "http://www.yoursite.com"; // Do not include the final "/"
function combineMenus(frm, menu1, menu2) {
with (frm) {
str = menu1.options[menu1.selectedIndex].value;
str += menu2.options[menu2.selectedIndex].value;
url = site + "/" + str + ".html";
window.location.href = url;
  }
}
//  End -->
</script>

</head>

<body bgcolor="#444444">
<form name=menufrm>
<select name=menu1>
<option value="">Genre</option>
<option value="Techno">Techno</option>
<option value="Dance">Dance</option>
<option value="Rock">Rock</option>
</select>

<select name=menu2>
<option value="">Your Connection</option>
<option value="56k">56k</option>
<option value="Cable">Cable</option>
<option value="(A)DSL">(A)DSL</option>
</select>

<input type=button class=inputbutton value="Listen in" onClick="combineMenus(this.form, this.form.menu1, this.form.menu2)">
</form>
</body>
</html>

Den passe ikke helt endnu til det look mit site gerne skulle få.
Derfor ville jeg høre, om der er mulighed for at ændre den yderliger gennem css?

På forhånd Tak
MRB
Avatar billede z42cool Nybegynder
06. februar 2003 - 08:57 #1
Du kan sætte baggrundsfarve vha. background-color, men desværre ikke ændre borders på select bokse. Du kan derimod ændre border på input boksen og knappen vha. border!
Avatar billede nikolajdu Nybegynder
06. februar 2003 - 09:16 #2
z42cool har ret, men man kan snyde lidt og lave sin het egen som min her :

http://www.reflectoria.dk/javascript/SelectSmartLayer/SelectSmartLayer.htm

/Nikolaj
Avatar billede justdoit Nybegynder
06. februar 2003 - 11:07 #3
Jeg har også kigget lidt på det og lavet dette - du kan jo selv kigge lidt på det!

<html>
<head>
<style>
select {
font-family: verdana, helvetica, sans-serif;
color: #333333;
font-size: 9px;
background-color: #888888
; padding-top: 1px; padding-right: 1px; padding-bottom: 1px; padding-left: 1px; border: #000000; border-style: solid; border-top-width: 1px; border-right-width: 1px; border-bottom-width: 1px; border-left-width: 1px
}

}

.inputbutton {
font-family: verdana, helvetica, sans-serif;
color: #333333;
font-size: 9px;
background-color: #888888
; border: #000000; border-style: solid; border-top-width: 1px; border-right-width: 1px; border-bottom-width: 1px; border-left-width: 1px}


BODY {
    scrollbar-arrow-color: #E9C80A;
scrollbar-3dlight-color: #000000;
scrollbar-highlight-color: #FFFFFF;
scrollbar-face-color: #000000;
scrollbar-shadow-color: #FFFFFF;
scrollbar-darkshadow-color: #000000;
scrollbar-track-color: #000000;
}
</style>
<SCRIPT LANGUAGE="JavaScript">
<!-- Begin
site = "http://www.yoursite.com"; // Do not include the final "/"
function combineMenus(frm, menu1, menu2) {
with (frm) {
str = menu1.options[menu1.selectedIndex].value;
str += menu2.options[menu2.selectedIndex].value;
url = site + "/" + str + ".html";
window.location.href = url;
  }
}
//  End -->
</script>

</head>

<body bgcolor="#444444">

<form name=menufrm>
  <select name=menu1 class="inputbutton">
    <option value="">Genre</option>
<option value="Techno">Techno</option>
<option value="Dance">Dance</option>
<option value="Rock">Rock</option>
</select>

<select name=menu2>
<option value="">Your Connection</option>
<option value="56k">56k</option>
<option value="Cable">Cable</option>
<option value="(A)DSL">(A)DSL</option>
</select>

<input type=button class=inputbutton value="Listen in" onClick="combineMenus(this.form, this.form.menu1, this.form.menu2)">
</form>
</body>
</html>
Avatar billede kickmrb Nybegynder
06. februar 2003 - 11:21 #4
Thx for hjælpen.
Avatar billede justdoit Nybegynder
06. februar 2003 - 11:25 #5
var så lidt ;)
Avatar billede Ny bruger Nybegynder

Din løsning...

Tilladte BB-code-tags: [b]fed[/b] [i]kursiv[/i] [u]understreget[/u] Web- og emailadresser omdannes automatisk til links. Der sættes "nofollow" på alle links.

Loading billede Opret Preview
Kategori
Vi tilbyder markedets bedste kurser inden for webudvikling

Log ind eller opret profil

Hov!

For at kunne deltage på Computerworld Eksperten skal du være logget ind.

Det er heldigvis nemt at oprette en bruger: Det tager to minutter og du kan vælge at bruge enten e-mail, Facebook eller Google som login.

Du kan også logge ind via nedenstående tjenester