I was looking around a website that I go to a lot; and noticed that they had an option to 'collapse' a table with a shoutbox in it. I clicked, the page refreshed, and BAM, table's gone. (the site is bohegeha.com) then a little thing appears that says view-and if you click that; the shoutbox reappears.
I would like to do this for my website... does anyone know how?
collapse tables?
Moderator: General Moderators
All you have to do is add
into the TABLE tag to make it disapear. (It wont hold the space either - in compatible browser that is) And remove it from the tag to show the said table.
for more info on this, check out http://www.w3schools.com/css/pr_class_display.asp
Code: Select all
style="display:none;"for more info on this, check out http://www.w3schools.com/css/pr_class_display.asp
Re: collapse tables?
The always correct answer: look how they do it, and copy!mabufo wrote:I was looking around a website that I go to a lot; and noticed that they had an option to 'collapse' a table with a shoutbox in it. I clicked, the page refreshed, and BAM, table's gone. (the site is bohegeha.com) then a little thing appears that says view-and if you click that; the shoutbox reappears.
I would like to do this for my website... does anyone know how?
Re: collapse tables?
hello,
the code try to display one of them. There are also some other ways in doing so, using Javascript.
i hope, these help.
Regards.
its just a matter of condition. You can do that by having variables in session or cookies or through get method. you can pass values and try to test what you wanted to happen. Try this idea, this is using the get method:mabufo wrote:I was looking around a website that I go to a lot; and noticed that they had an option to 'collapse' a table with a shoutbox in it. I clicked, the page refreshed, and BAM, table's gone. (the site is bohegeha.com) then a little thing appears that says view-and if you click that; the shoutbox reappears.
I would like to do this for my website... does anyone know how?
Code: Select all
<?php
if ($_GET['show']==1) {
echo "This is shown.";
echo '<a href="?show=2">Hide</a>';
} else {
echo "This is hidden.";
echo '<a href="?show=1">Show</a>';
}
?>Code: Select all
<?php
<html>
<head><title></title></head>
<body>
<script language="Javascript">
function showHide(theID) {
doc = document.getElementById(theID);
if (doc.style.display=="") {
doc.style.display = "none";
doc.value = "Show";
} else
doc.style.display = "";
doc.value = "hide";
}
}
</script>
<input type="button" id="theButton" value="Show" onClick="showHide('menu');">
<div id="menu" style="background-color: green">
The menu will go here<br />
The menu will go here<br />
The menu will go here<br />
The menu will go here<br />
The menu will go here<br />
The menu will go here<br />
The menu will go here<br />
The menu will go here<br />
The menu will go here<br />
</div>
</body>
</html>
?>Regards.
well yes you could do it with PHP and send everything back to the server, but what they were talking about in the previous posts makes much more sense... use CSS and javascript. give the table an ID, then the link would be something along the lines of "javascript:document.disappearingTable.style='display: none;'" you'd need a little more to have the same link toggle the display status, but as they said - just view the source and see how they did it.