Improve SELECT_BOX
This commit is contained in:
parent
3d2c9c53cf
commit
c7c78744dd
3 changed files with 11 additions and 69 deletions
|
|
@ -94,9 +94,13 @@ function displaySelectBox(p_name) {
|
|||
}
|
||||
newDiv.innerHTML=id$("select_box"+p_name).innerHTML;
|
||||
var viewport = document.viewport.getDimensions();
|
||||
let div_height=newDiv.getHeight();
|
||||
if ( div_height > window.innerHeight) {
|
||||
div_height = window.innerHeight / 2;
|
||||
}
|
||||
var locPosY=posY;
|
||||
if ( posY+offsetY+ newDiv.getHeight() > window.innerHeight -3) {
|
||||
locPosY-=newDiv.getHeight()+20
|
||||
if ( posY+offsetY+ div_height > window.innerHeight -3) {
|
||||
locPosY-=div_height+20
|
||||
}
|
||||
newDiv.style.top=locPosY+"px";
|
||||
|
||||
|
|
@ -112,7 +116,7 @@ function displaySelectBox(p_name) {
|
|||
id$("search_"+p_name+"_t_list").focus();
|
||||
}
|
||||
} catch(e) {
|
||||
alert(e.message);
|
||||
console.error(e.message);
|
||||
}
|
||||
|
||||
}
|
||||
|
|
|
|||
|
|
@ -156,17 +156,17 @@ class Select_Box
|
|||
{
|
||||
if ($this->item[$i]['type']=="url")
|
||||
{
|
||||
printf('<li><a href="%s">%s</a></li>', $this->item[$i]['url'], $this->item[$i]['label']);
|
||||
printf('<li><a href="%s"><span class="search-content">%s</span></a></li>', $this->item[$i]['url'], $this->item[$i]['label']);
|
||||
}
|
||||
else // For javascript
|
||||
if ($this->item[$i]['type']=="javascript")
|
||||
{
|
||||
printf('<li><a href="javascript:void(0)" onclick="%s">%s</a></li>', $this->item[$i]['javascript'],
|
||||
printf('<li><a href="javascript:void(0)" onclick="%s"><span class="search-content">%s</span></a></li>', $this->item[$i]['javascript'],
|
||||
$this->item[$i]['label']);
|
||||
}
|
||||
else if ($this->item[$i]['type']=="value")
|
||||
{
|
||||
printf('<li><a href="javascript:void(0)" onclick="%s">%s</a></li>', $this->item[$i]['javascript'],
|
||||
printf('<li><a href="javascript:void(0)" onclick="%s"><span class="search-content">%s</span></a></li>', $this->item[$i]['javascript'],
|
||||
$this->item[$i]['label']);
|
||||
}
|
||||
else if ($this->item[$i]['type']=="input")
|
||||
|
|
|
|||
|
|
@ -3,69 +3,7 @@
|
|||
<script src="prototype.js"></script>
|
||||
|
||||
<style>
|
||||
/* The container <div> - needed to position the dropdown content */
|
||||
.select_box{
|
||||
position: relative;
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
/* Dropdown Content (Hidden by Default) */
|
||||
.dropdown-content {
|
||||
display: none;
|
||||
position: absolute;
|
||||
background-color: #f9f9f9;
|
||||
min-width: 160px;
|
||||
box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
/* Links inside the dropdown */
|
||||
.dropdown-content a {
|
||||
color: black;
|
||||
padding: 12px 16px;
|
||||
text-decoration: none;
|
||||
display: block;
|
||||
}
|
||||
|
||||
/* Change color of dropdown links on hover */
|
||||
.dropdown-content a:hover {background-color: #f1f1f1}
|
||||
|
||||
/* Show the dropdown menu on hover */
|
||||
.dropdown:hover .dropdown-content {
|
||||
display: block;
|
||||
}
|
||||
.select_box {
|
||||
border:solid 0.5px darkblue;
|
||||
background:white;
|
||||
width:455px;
|
||||
max-width:250px;
|
||||
padding:3px;
|
||||
margin:0px;
|
||||
display:none;
|
||||
position:absolute;
|
||||
z-index:10;
|
||||
}
|
||||
div.select_box ul {
|
||||
list-style:none;
|
||||
padding:2px;
|
||||
margin:1px;
|
||||
width:100%;
|
||||
top:10px;
|
||||
|
||||
}
|
||||
div.select_box ul li {
|
||||
padding-top:2px;
|
||||
padding-bottom:2px;
|
||||
margin:2px;
|
||||
}
|
||||
div.select_box a {
|
||||
text-decoration:none;
|
||||
color : darkblue;
|
||||
}
|
||||
div.select_box a:hover,div.select_box ul li:hover {
|
||||
background-color : blue;
|
||||
color:lightgrey;
|
||||
}
|
||||
</style>
|
||||
|
||||
</head>
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue