How to know if slideToggle() moves upward or downward?

jquery, jquery-ui

Solution

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.

Problem

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> ```

Original source