Question

what my current Code do :
i have this HTML

 <li>
   <span>Logged in as</span>&nbsp;
   <a class="user" href="#"><?php echo $this->loggedas ?></a>&nbsp;
   <a id="loginarrow" href="javascript: void(0);"></a>
 </li>

this is my JS for above loginarrow id

 $("#loginarrow").click(function() {
   $("#logindrop").toggle("slow");
   return false;
 });

its working great but i can close it by clicking it again.
i dont want so i want that if its open and i click on background so it must close.
for that i did so

 $("#loginarrow,body").click(function() {
   $("#logindrop").toggle("slow");
   return false;
 });

now its working cool,But Got another problem.

1 = i have many other html elements in Page (Body) in which there are other events to call.so in this case whenever i click other elements in my page so its Toggling my this div loginarrow.

i want the same functionality but not on my other elements only on background.
Any Hint

Answer 1

close it only when it visible.

$("body").click(function() { 
   if ($("#logindrop").is(":visible"))
      $("#logindrop").hide("slow");       
});