View Full Version : Changing content within a page

07-15-2009, 09:26 PM

I want to be able to show some content, while at the same time hide some other content using JS. Can anyone help me with this?

07-15-2009, 09:26 PM
Can you please post some more details on the content and the page to be able to help you in an accurate way.

07-15-2009, 09:47 PM
Sorry if I wasn't clear.

For example:

[a button here]

[some text here, showing (lets call this text 1) ]

[some text here, hidden (lets call this text 2)]

and when you click the button

[a button here]

[text 2 here, showing]

[text 1 here, hidden]

If i am being confusing, please let me know. Thanks for the help!

07-15-2009, 09:50 PM
You put your text in an html tag <label id='label1'> and <label id='label2'> for example.
when you click on the button set a function named btnClicked() like this:

function btnClicked()
document.getElementById("label1").style.display = "";
document.getElementById("label2").style.display = "none";

07-15-2009, 09:56 PM
Thanks very much for your reply! Luckily, I found some code that worked perfectly for me!


<!--put your links here-->
<a href=#stayhere id=a1 onclick="showhide(this.id);">first link</a>
<a href=#stayhere id=a2 onclick="showhide(this.id);">second link</a>
<a href=#stayhere id=a3 onclick="showhide(this.id);">third link</a>
<!--end where you put your links-->
<!--put all your divs here-->
<div id=a1div style="display:none;background-color:red;width=100px;height=100px;">first div</div>
<div id=a2div style="display:none;background-color:blue;width=100px;height=100px;">second div</div>
<div id=a3div style="display:none;background-color:green;width=100px;height=100px;">third div</div>
<!--end where you put your divs-->


<script type=text/javascript>
function showhide(Id){
var Par=document.getElementById(Id).parentNode;
var count='3'
var childlngth=Par.childNodes.length-1;



Thanks again for all of your help!

EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum