|
Copied To Clipboard!
<!DOCTYPE html>
<head>
<title>Form Button Opens Hidden DIV Layer Menu Javascript Code Snippet</title>
<style>
BODY {font-family:verdana,arial,ms sans serif; font-size:90%; color:#000000;}
a:link {color:#0000ff; text-decoration:none;} /* unvisited link */
a:visited {color:#0000ff; text-decoration:none;} /* visited link */
a:hover {color:#007730; text-decoration:underline;} /* mouse over link */
a:active {color:#00ff00; text-decoration:underline;} /* selected link */
.boxit {
position:absolute;
top:90px;
left:10;
width:auto;
height:16px;
padding:8px 8px 8px 8px;
border:solid 1px beveled;
background-color:#e6e6e6;
box-shadow: 0 0 6px rgba(0, 0, 0, 0.5);
-moz-box-shadow: 0 0 6px rgba(0, 0, 0, 0.5);
-webkit-box-shadow: 0 0 6px rgba(0, 0, 0, 0.5);
text-shadow:0 1px 0 rgba(0,0,0,0.4);}
</style>
<script>
<!--
/* Begin Form Button Opens Hidden DIV Layer Menu
== This Script Free To Use Providing This Notice Remains ==
== This Script Has Been Found In The http://snapbuilder.com Free Public Codes Library ==
== NOTICE: Though This Material May Have Been In A Public Depository, Certain Author Copyright Restrictions May Apply ==
== Created by: Sandeep Gangadharan : http://sivamdesign.com/scripts/ : Creative Commons License ==
== Modified by: SnapBuilder.com ==
*/
(document.getElementById) ? dom = true : dom = false;
function hideIt() {
if (dom) {document.getElementById('DivLayer').style.visibility='hidden';}
if (document.layers) {document.layers["DivLayer"].visibility='hide';}
}
function showIt() {
if (dom) {
if (document.getElementById('DivLayer').style.visibility=='visible') { hideIt(); }
else {document.getElementById('DivLayer').style.visibility='visible'} }
if (document.layers) {
if (document.layers["DivLayer"].visibility=='show') { hideIt(); }
else {document.layers["DivLayer"].visibility='show'} }
window.setTimeout("hideIt();", 5000) // time for the DIV box to automatically close - each 1000 = 1 second
}
// -->
</script>
</head>
<body>
<h3>Example:</h3>
<form><input type="Button" value="Open Menu Bar" onClick="javascript:showIt();"></form>
<div id="DivLayer" class="boxit" style="visibility:hidden">
<a href="http://snapbuilder.com">SnapBuilder</a> |
<a href="http://sivamdesign.com/scripts/">Sivan Design</a> |
<a href="http://www.sitepronews.com">SiteProNews</a> |
<a href="http://www.exactseek.com">ExactSeek</a>
</div>
<br /><br />
<div id="snippet">
[ This code example from <a href="http://snapbuilder.com/code_snippets/copy_code_snippet_75.html">Form Button Opens Hidden DIV Layer Menu</a> page. ]
</div>
</body>
</html>
|