Loans - Boston Attractions - iPhone Reviews - Credit Counseling - Car Loan

PDA

View Full Version : simple question


bartolay13
Dec 31st 2007, 10:46 pm
hello there,

just a question, how does the drop down thing work, example, below this page the "Posting Rules" tab and or the "Similar Threads" tab, when i click the arrow on the right it hides and unhides the content of the tab...

will i do this in js? php? ajax? without reloading the whole page. hihihi, just cant get the logic. :D

selling vcc
Jan 1st 2008, 12:59 am
This can be done with javascript, by changing the css property visibility:visible to visibility:hidden and vice-versa

Try this example

<html>
<head>
<title>Javascript collapse</title>
<style>
<!--
#title,#content
{
border:solid 1px red;
width:300px;
margin:0px 5px;
padding:5px;
}

#content
{
visibility:hidden;
}
-->
</style>

<script language="javascript" type="text/javascript">
function changeVisibility()
{
element = document.getElementById('content');
button = document.getElementById('button');
currentVisibility = element.style.visibility;
if(currentVisibility=='visible')
{
element.style.visibility='hidden';
button.innerHTML ='(expand)';
}
else
{
element.style.visibility='visible';
button.innerHTML ='(collapse)';
}
}
</script>
</head>

<body>

<div id="title">Hot News <a href="#" onclick="changeVisibility();return false"><span id="button">(expand)</span></a></div>
<div id="content">Will i do this in js? php? ajax? without reloading the whole page. hihihi, just cant get the logic.</div>

</body>
</html>