to pimp my website with a suggestion text box can be very cool... the meaning behind it is to show suggestions based on user's input. As a AJAX.net fan, I downloaded Michales great suggestion box and have used it in combination with some other controls on my page... eh voila!
have you ever tried to make show a div over a drop-down? Microsoft's MSDN answer sounds like that:
Remarks
-The SELECT element is available in HTML and script, as of Internet Explorer 3.0.
-This element is a windowed control and does not support the z-index attribute or zIndex property.
-This element is an inline element.
-This element requires a closing tag.
so now i still have the same problem like before. but since i get used to display div's i did the following try:
My HTML part looks like that:
<div id="myDivStyle" class="divBoxing">some
more
information
<input id="text" maxlength="30" onfocus="myLoveleySelectBox(true);void(0);" onblur="myLoveleySelectBox(false);void(0);" />
<br/>
<select id="myDropDown" style="visibility:visible;">
<option value="a">A
<option value="b">B
</select>
the css for my suggestion can looks like that (div):
<style type="text/css">
.divBoxing
{
border-right: #000000 3px dashed;
border-top: #000000 3px dashed;
border-left: #000000 3px dashed;
border-bottom: #000000 3px dashed;
line-height: 100px;
line-width:140;
visibility:hidden;
position:absolute;
left:12px;
top:36px;
background-color:Teal;
color:White;
}
</style>
and here the last part, a little bit javascript
<script type="text/javascript" language="javascript">
function myLoveleySelectBox(b)
{
var l = document.getElementById("myDivStyle");
l.style.visibility = b ? "visible" : "hidden";
var l = document.getElementById("myDropDown");
l.style.visibility = !b ? "visible" : "hidden";
}
</script>
enjoy it!
Sample page available at:
DivAndDropDown.htm
Posts
No comments:
Post a Comment