Home/ Questions/Q 7956649
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-06-04T04:03:19+00:00

How does this code determine either to toggle upwards or toggle downwards? Please help

  • 0

How does this code determine either to toggle upwards or toggle downwards? Please help out. Thanks.

<html>
    <head>    
        <script type="text/javascript" src="jquery.js"></script>
        <script type="text/javascript"> 
            $(document).ready(function(){
                $(".flip").click(function(){
                    $(".panel").slideToggle();
                });
            });
        </script>

        <style type="text/css"> 
            div.panel,p.flip {
                margin:0px;
                padding:5px;
                text-align:center;
                background:#e5eecc;
                border:solid 1px #c3c3c3;
            }
            div.panel {
                height:120px;
                display:none;
            }
        </style>
    </head>

    <body>
        <div class="panel">
            <p>Crap.</p>
        </div>
        <p class="flip">Show/Hide Panel</p>
    </body>
</html>
Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    You can check to see if the element is visible or not. If it’s visible, slideToggle() will move up. If it’s not visible, it will move down.

    // Want to know if it's visible?
$(this).is(":visible");

    You could also determine the direction it took after the fact as well:

    $(".panel").slideToggle("slow", function(){
  alert( "I moved " + $(this).is(":visible") ? "Down" : "Up" );
})

    This is, of course, assuming you don’t have any positioned element, which it looks as though you don’t.

    • 0