Saturday, November 24, 2012

To show/hide any content using javascript

Code:
<script language=”javascript”>
function showContent() {
var ele = document.getElementById(“toggleText”);
var text = document.getElementById(“displayText”);
if(ele.style.display == “block”) {
ele.style.display = “none”;
text.innerHTML = “show”;
}
else {
ele.style.display = “block”;
text.innerHTML = “hide”;
}
}
</script>
<a id=”displayText” href=”javascript:showContent();”>show</a> <== click Here
<div id=”toggleText” style=”display: none”><h1>This is hidden content</h1></div>

Output:
Before link is clicked





After link is clicked

 

No comments:

Post a Comment