How To make page with hidden info

Status
Not open for further replies.

RapidshareResellers

Active Member
58
2009
0
0
i want to make a simple html page or post

like i type in post

11
22
33
44

at the end link

when visitor click on link then

11
22
33
44

this hide and show other

content

55
66
77
88
on that single post
 
12 comments
HTML:
Code:
<span style="display: block" id="show1">1 2 3</span>
<span style="display: none" id="show2">4 5 6</span>
<br /><br />
<a href="#" onclick="showhide(); return false;">Show / Hide</a>
Javascript: (Put inside <head> tag)
Code:
function showhide() {
    // Coded by CyberJ37
    var show1 = document.getElementById("show1");
    var show2 = document.getElementById("show2");
    if(show2.style.display == "none") {
        show1.style.display = "none";
        show2.style.display = "block";
    }
    else {
        show2.style.display = "none";
        show1.style.display = "block";
    }
}
 
Nice peace of code Cyberj37 but i think there is a little typo which is

show1.style.display = "none";
show1.style.display = "block";


Corrected Version:

function showhide() {
// Coded by CyberJ37
var show1 = document.getElementById("show1");
var show2 = document.getElementById("show2");
if(show2.style.display == "none") {
show2.style.display = "block";
show1.style.display = "none";
}
else {
show1.style.display = "block";
show2.style.display = "none";
}
}
 
Thanks Cyberj37 but if

11
22
33
44

at the end link

when visitor click on link then

11
22
33
44

this hide and show other

content

55
66
77
88

on another link

hide this and show
another

99
00
11
22

then
 
This code does what you ask for in non-sequential order. I apologize for poor code formatting because i wrote it in hurry.

<html>
<HEAD>
<SCRIPT language="JavaScript">
<!--


function get_random()
{
var ranNum= Math.floor(Math.random()*5) ;
return ranNum;
}


function compareText(Text){
if(document. getElementById("show1") . innerText != null){
if(document. getElementById("show1") . innerText != Text){
document. getElementById("show1") . innerText = "";
document. getElementById("show1") . innerText = Text;
return false;
}else{return true;}
}else{
document. getElementById("show1") . innerText = Text;
return false;
}

}
function showhide()
{
var text;
var loop = true;
while(loop){
var random=get_random();
switch(random){
case 0:
text = "1 2 3";
loop = compareText(text);
break;
case 1:
text = "4 5 6";
loop = compareText(text);
break;
case 2:
text = "7 8 9";
loop = compareText(text);
break;
case 3:
text = "10 11 12";
loop = compareText(text);
break;
case 4:
text = "13 14 15";
loop = compareText(text);
break;
}
}
}


//-->
</SCRIPT>
</HEAD>
<BODY>
<FORM name="form1">
<span style="display: block" id="show1"></span>
<br /><br />
<a href="#" onclick="showhide(); return false;">Show / Hide</a>
</FORM>
</BODY>
</html>
 
Status
Not open for further replies.
Back
Top