ansaurus

Question

Answer 1

A:

Change its opacity from 100 % to 0 and then hide it with display

Do

$('div').css({ "opacity": "0", "display": "none" });

or

Do

$('div').css({ 'opacity': '0', 'display': 'none' });

Its untested, but could work.. not sure if handling opacity this way works :)

Zayatzz 2009-08-11 11:17:12

Answer 2

A:

.click will work just fine inside the div tag. Just make sure you're not over top of the select element.

$('div').click(function(e) {
    var $target = $(e.target);
    if (!$target.is("select")) { $(this).hide() };
});

ScottE 2009-08-11 11:24:04

How is a div ever going to be a select?

redsquare 2009-08-11 11:26:41

Yep, should have tested, need to look at the target...

ScottE 2009-08-11 11:33:13

Answer 3

+2 A:

I think the issue is that divs don't fire the onfocusout event.

You'll need to capture click events on the body and then work out if the target was then menu div. If it wasn't, then the user has clicked elsewhere and the div needs to be hidden.

  <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" 
                    "http://www.w3.org/TR/html4/loose.dtd"&gt;
<html>
<head>
  <script src="http://code.jquery.com/jquery-latest.js"&gt;&lt;/script&gt;

  <script>
  $(document).ready(function(){

    $("body").click(function (evt) {
         var target = evt.target;
      if(target.tagName !== 'DIV'){
      $(".menu").hide();
     }   
    });

  });
  </script>
  <style>span {display:none;}</style>
</head>
<body>
  <p><div class="menu">Menu....</div></p>

  Other Stuff


</body>
</html>

djch 2009-08-11 11:24:57

I don't think this answers the question. My understanding is that aamir wants to hide the div when you click inside, unless you click the select element.

ScottE 2009-08-11 11:36:57

This is wrong. What happens when the user clicks on another div which is not part of the menu?

rahul 2009-08-11 11:40:53

A div can accept focus and issue onfocus and onblur if you specify a tabindex for it. Try this:`<div tabindex="100" onfocus="alert('!')"> Blah</div>`

vit 2009-08-11 11:53:32

"This is wrong. What happens when the user clicks on another div which is not part of the menu?"Yes, thats true, it was just a simple example to demonstrate capturing events on the body and determining the actual element that was clicked. When properly implemented, you'd want to check other properties of the target (most likely the id) to ensure you were not clicking on the menu again.

djch 2009-08-11 13:40:13

Answer 4

+1 A:

$("body").click(function (evt) {
     var target = evt.target;
     if(target.id !== 'menuContainer'){
            $(".menu").hide();
    }                
});

give the div an id, for instance "menuContainer". then you can check by target.id instead of target.tagName to make sure its that specific div.

PulledBull 2009-08-20 13:32:46

ansaurus

tags:

views:

answers:

How to blur the div element?

related questions