How it is possible to create a individual Dropdown Layout.
HTML/JS Sourcecode:
<style type="text/css">
div.individualDropdown {
border:1px solid #ccc;
width:180px;
height:18px;
overflow:visible;
background-color:#fff;
line-height:17px;
float:left;
background-image:url(templates/cmsinstances/waglechnercom/wwtechchannel/dropdown_icon.png);
background-repeat:no-repeat;
background-position:top right;
}
div.individualDropdown span {
font-size:14px;
font-family:arial,verdana;
color:#444;
}
div.individualDropdown select {
width:180px;
position:relative;
left:0px;
top:-20px;
opacity:0;
filter:alpha(opacity=0);
-moz-opacity:0;
-khtml-opacity:0;
}
</style>
<div class="individualDropdown">
<span id="dropdown1txt" >Dropdown</span>
<select id="dropdown1select" name="dropdown1">
<option value="0">Dropdown</option>
<option value="1">Wert1</option>
<option value="2">Wert2</option>
</select>
</div>
<script language='JavaScript' type='text/javascript' />
$("#dropdown1select").change(
function() {
$("#dropdown1txt").html($("#dropdown1select option:selected").text());
}
);
</script>
Example:
Dropdown
$("#dropdown1select").change(
function() {
$("#dropdown1txt").html($("#dropdown1select option:selected").text());
}
);