Full version: jsB@nk » Utility » Search-code » Internal Search Box
URL: https://www.javascriptbank.com/internal-search-box.html
This JavaScript search tool can be used to create a dropdown search box for your Web site, just like forums. You can also create dropdown search forms, hint boxes, and menus.
Full version: jsB@nk » Utility » Search-code » Internal Search Box
URL: https://www.javascriptbank.com/internal-search-box.html
<style type="text/css"><!--div.sample_attach, a.sample_attach { width: 100px; border: 1px solid #DFAD00; background: #FFFFEE; padding: 0px 5px; font-weight: 900; color: #00009C; text-align: center;}a.sample_attach { display: block; border-bottom: none; text-decoration: none;}form.sample_attach { position: absolute; visibility: hidden; border: 1px solid #DFAD00; background: #FFFFEE; color: #00009C; padding: 0px 5px 2px 5px; text-align: center;}--></style>
<script type="text/javascript"><!--// Copyright (C) 2005 Ilya S. Lyubinskiy. All rights reserved.// Technical support: http://www.php-development.ru/// http://www.php-development.ru/javascripts/dropdown.php//// YOU MAY NOT// (1) Remove or modify this copyright notice.// (2) Distribute this code, any part or any modified version of it.// Instead, you can link to the homepage of this code:// http://www.php-development.ru/javascripts/dropdown.php.//// YOU MAY// (1) Use this code on your website.// (2) Use this code as a part of another product provided that// its main use is not creating javascript menus.//// NO WARRANTY// This code is provided "as is" without warranty of any kind, either// expressed or implied, including, but not limited to, the implied warranties// of merchantability and fitness for a particular purpose. You expressly// acknowledge and agree that use of this code is at your own risk.// ***** Popup Control *********************************************************function at_display(x) { var win = window.open(); for (var i in x) win.document.write(i+' = '+x[i]+'<br>');}// ***** Show Aux *****function at_show_aux(parent, child) { var p = document.getElementById(parent); var c = document.getElementById(child ); var top = (c["at_position"] == "y") ? p.offsetHeight+2 : 0; var left = (c["at_position"] == "x") ? p.offsetWidth +2 : 0; for (; p; p = p.offsetParent) { top += p.offsetTop; left += p.offsetLeft; } c.style.position = "absolute"; c.style.top = top +'px'; c.style.left = left+'px'; c.style.visibility = "visible";}// ***** Show *****function at_show() { var p = document.getElementById(this["at_parent"]); var c = document.getElementById(this["at_child" ]); at_show_aux(p.id, c.id); clearTimeout(c["at_timeout"]);}// ***** Hide *****function at_hide() { var c = document.getElementById(this["at_child"]); c["at_timeout"] = setTimeout("document.getElementById('"+c.id+"').style.visibility = 'hidden'", 333);}// ***** Click *****function at_click() { var p = document.getElementById(this["at_parent"]); var c = document.getElementById(this["at_child" ]); if (c.style.visibility != "visible") at_show_aux(p.id, c.id); else c.style.visibility = "hidden"; return false;}// ***** Attach *****// PARAMETERS:// parent - id of visible html element// child - id of invisible html element that will be dropdowned// showtype - "click" = you should click the parent to show/hide the child// "hover" = you should place the mouse over the parent to show// the child// position - "x" = the child is displayed to the right of the parent// "y" = the child is displayed below the parent// cursor - Omit to use default cursor or check any CSS manual for possible// values of this fieldfunction at_attach(parent, child, showtype, position, cursor) { var p = document.getElementById(parent); var c = document.getElementById(child); p["at_parent"] = p.id; c["at_parent"] = p.id; p["at_child"] = c.id; c["at_child"] = c.id; p["at_position"] = position; c["at_position"] = position; c.style.position = "absolute"; c.style.visibility = "hidden"; if (cursor != undefined) p.style.cursor = cursor; switch (showtype) { case "click": p.onclick = at_click; p.onmouseout = at_hide; c.onmouseover = at_show; c.onmouseout = at_hide; break; case "hover": p.onmouseover = at_show; p.onmouseout = at_hide; c.onmouseover = at_show; c.onmouseout = at_hide; break; }}// Multiple onload function created by: Simon Willison// http://simonwillison.net/2004/May/26/addLoadEvent/function addLoadEvent(func) { var oldonload = window.onload; if (typeof window.onload != 'function') { window.onload = func; } else { window.onload = function() { if (oldonload) { oldonload(); } func(); } }}addLoadEvent(function() { at_attach("src_parent", "src_child", "click", "x", "pointer");});//--></script>
<div style="cursor: pointer;" class="sample_attach" id="src_parent">Site Search</div><form style="position: absolute; visibility: hidden; top: 629px; left: 357px;" class="sample_attach" id="src_child"><b>Enter search terms:</b><br><input style="margin-bottom: 1px; width: 170px;" name="terms" type="text"><br><input value="Submit" type="submit"></form>