Improve SELECT_BOX

This commit is contained in:
sparkyx 2025-11-18 11:23:46 +01:00
parent 3d2c9c53cf
commit c7c78744dd
3 changed files with 11 additions and 69 deletions

View file

@ -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);
}
}

View file

@ -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")

View file

@ -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>