Thursday, 21 February 2013

Hide and expand in html


<script language="javascript">
function toggle5(showHideDiv, switchImgTag)
{
        var ele = document.getElementById(showHideDiv);
        var imageEle = document.getElementById(switchImgTag);
        if(ele.style.display == "block")
{
                ele.style.display = "none";
imageEle.innerHTML = '<img src="C:/Users/Tiara/Desktop/plus.png" height=15 width=15>';
        }
        else
{
                ele.style.display = "block";
                imageEle.innerHTML = '<img src="C:/Users/Tiara/Desktop/minus.png" height=15 width=15>';
        }
}
</script>

<div id="headerDivImg">
    <div id="titleTextImg">Let's use images!</div>
    <a id="imageDivLink" href="javascript:toggle5('contentDivImg', 'imageDivLink');">
<img src="C:\Users\Tiara\Desktop\minus.png" height=15 width=15>
</a>
</div>
<div id="contentDivImg" style="display: block;">This demo uses plus and minus images for hiding and showing your div dynamically.</div>

No comments:

Kiro - Core Features

What is Kiro Kiro is an innovative AI-powered IDE that revolutionizes software development through intelligent assistance and structured wor...