Sliding Control using Javascript.

We can make toggle style using using javascript very easily. Jquery is an alternate option for this. 

The below Javascript method will read the Panel control and change its Display style based on the initialization. By default it is “Block” if it is block then we needs to change it to “None” & wise versa .

Include this code in side Script block in aspx page

function toggleMenu() {

            var thisMenu = document.getElementById('panel')

            if (thisMenu.style.display == 'block') {

                thisMenu.style.display = 'none';

            } else {

                thisMenu.style.display = 'block';

            }

            return thisMenu;

        } 

Whenever click on div it will make the feel of toggle automatically. But actually it is making display of the control usefully.

  <form id="form1" runat="server">

    <div id="flip" onclick="toggleMenu()">

        ↕</div>

    <div id="panel">

        <img src="Lighthouse.jpg" alt="" height="200" /><br />

        <img src="Penguins.jpg" alt="" height="200" /><br />

        <img src="Tulips.jpg" alt="" height="200" /><br />

    </div>

    </form>