Hello, Everyone. This is my first time here at the forums. I'm in need of help finding or finishing this script I've already have.
Need
Cookies added on this script posted below to allow their browser to remember last divs was selected when they come back or refresh.
Could Use
Any other type of script that uses same funtions of the one below with cookies if can't be wrote in same way or added on.
What Script does
It's a multi show and hide which hides all div's at start until user clicks on a link to show multi divs selected inside link coding. Once a div is clicked it hides all other divs which isn't coding inside the link selected.
Script
HTML Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<meta http-equiv="Content-type" content="text/html; charset=UTF-8" />
<title></title>
<meta http-equiv="Content-Language" content="en-us" />
<meta name="author" content="" />
<script type="text/javascript">
function show(obj){
oDiv=document.getElementsByTagName("DIV")
for(var i=0;i<oDiv.length;i++){
if(oDiv[i].className=="hidden_element"){
oDiv[i].style.visibility="hidden"
}
}
for(var j=0;j<arguments.length;j++){
document.getElementById(arguments[j]).style.visibility="visible";
}
}
</script>
<script type="text/javascript">
function hideDivs(){
var arr = document.getElementsByTagName('div')
for(var i=0; i<arr.length;i++){
arr[i].style.display = (arr[i].style.display == 'block')? 'none':'block';
}
}
</script>
</head>
<body>
Showing :
<br>
<br>
<a href="#" onclick="show('div1','sdiv1')">div 01</a><br>
<a href="#" onclick="show('div2','sdiv2')">div 02</a><br>
<a href="#" onclick="show('div3','sdiv3')">div 03</a><br>
<div class="hidden_element" id="sdiv1" style="position: absolute; top: 8px; left: 70px; visibility:hidden; ">
Div 01
</div>
<div class="hidden_element" id="sdiv2" style="position: absolute; top: 8px; left: 70px; visibility:hidden; ">
Div 02
</div>
<div class="hidden_element" id="sdiv3" style="position: absolute; top: 8px; left: 70px; visibility:hidden; ">
Div 03
</div>
<div class="hidden_element" id="div1" style="position: absolute; top: 8px; left: 150px; visibility:hidden; ">
This is random content of Div 01
</div>
<div class="hidden_element" id="div2" style="position: absolute; top: 8px; left: 150px; visibility:hidden; ">
This is random content of Div 02
</div>
<div class="hidden_element" id="div3" style="position: absolute; top: 8px; left: 150px; visibility:hidden; ">
This is random content of Div 03
</div>
</body>
</html>
|
