Debt Consolidation - Just Holden Commodores - Kamala Harris - Wordpress Themes - Debt Consolidation
PDA

View Full Version : Show on click javascript

balkanboy
Aug 26th 2006, 10:15 am
I have one div and I want it not to be visible by default. I want javascript that can allow me to click on some link to display that div and it's content.After page refreshes I want that div to be invisible again(default) I tried lot of ready made codes but none of them worked.
Can you help me? Detailed explanation would be cool since I don't know anything about javascript.
mjamesb
Aug 26th 2006, 10:46 pm
Just give the div a style of display:none, then when they click the link call a javascript function to show the div.

<html>
<body>
<div id="HiddenDiv" style="display:none;">Content</div>

<a href="javascript:ShowDiv()">Show Div</a> or <div onclick="ShowDiv()">Click Me</div>

<script language="javascript">
function ShowDiv()
{
document.getElementById("HiddenDiv").style.display = '';
}
</script>

or do the same effect using a style sheet ..make one class hidden the other visible then in script do:
document.getElementById("HiddenDiv").className = newclassname
balkanboy
Aug 27th 2006, 7:52 am
Thanks but it didn't work because I wanted to use it in combinarion with smarty.
phper
Aug 27th 2006, 5:27 pm
You need to put curly brackets in a {literal}...{/literal} block to tell Smarty not to try to parse it as a Smarty tag.

Something like this:

<script type="text/javascript">
{literal}
function showDiv()
{
document.getElementById("HiddenDiv").style.display = "block";
}
{/literal}
</script>


P.S.: You may also want to make the "Click Me" or "Show Div" invisible after it'
s clicked (because it no longer makes sense after it's clicked once), with similar way as the above, just that setting the "display" to "none" instead of "block".