When the suggestion box is closed, how can the Search & Clear button move up to its original place?
What code should I insert to do this?
This is my current code:
Expand|Select|Wrap|Line Numbers
- <html>
- <head>
- <title>
- Brandon's Search Engine
- </title>
- <style type="text/css">
- #suggestion {
- border: 1px solid black;
- visibility: hidden;
- position: relative;
- background-color: white;
- z-index: 10;
- }
- #suggestion a {
- font-size: 12pt;
- color: black;
- text-decoration: none;
- display: block;
- width: 648px;
- height: auto;
- text-align: left;
- padding: 2px;
- }
- #suggestion a:hover {
- background-color: #dddddd;
- width: 644px;
- padding: 2px;
- }
- </style>
- <script type="text/javascript">
- //document.getElementById("suggestion")
- function getSuggestion(q) {
- var ajax;
- if(window.XMLHttpRequest)//for ie7+, FF, Chrome
- ajax = new XMLHttpRequest();//ajax object
- else
- ajax = new ActiveXObject("Microsoft.XMLHTTP");//for ie6 and previous
- ajax.onreadystatechange = function() {
- if(ajax.status === 200 && ajax.readyState === 4) {
- //if result are not there then don't display them
- if(ajax.responseText === "")
- document.getElementById("suggestion").style.visibility = "hidden";
- else {
- document.getElementById("suggestion").style.visibility = "visible";
- document.getElementById("suggestion").innerHTML = ajax.responseText;
- }
- }
- };
- ajax.open("GET", "suggestion.php?q=" + q, false);
- ajax.send();
- }
- </script>
- <script>
- function validateForm()
- {
- var x=document.forms["q"]["q"].value;
- if (x==null || x=="")
- {
- return false;
- }
- }
- </script>
- </head>
- <body>
- <form method="GET" action="search.php" name="q" onsubmit="return validateForm()">
- <table align="center">
- <tr>
- <td>
- <h1><center>Brandon's Search Engine</center></h1>
- </td>
- </tr>
- <tr>
- <td align="center">
- <input type="text" name="q" style="height: 27px; width: 650px; padding: 2px"
- onkeyup="getSuggestion(this.value)" autocomplete="off" onblur="blur() document.getElementById('suggestion').style.visibility = 'hidden'"/>
- <div id="suggestion" style="width: 648px">
- </div>
- </td>
- </tr>
- <tr>
- <td align="center">
- <input type="submit" name="submit" value="Search" style="height: auto; width: 60px; padding: 2px" />
- <input type="reset" value="Clear" style="height: auto; width: 50px; padding: 2px" />
- </td>
- </tr>
- <tr>
- <td align="center">
- To insert your site in result fill in the form at <a href="insert.php">here</a>.
- </td>
- </tr>
- </table>
- <input type="hidden" name="page" value="0" />
- </form>
- </body>
- </html>