CODEWITHSUNDEEP
javascripteventsclickz-index
aditya parikh
aditya parikh

Reputation: 595

Click event not recognized on higher z-index element

I have a code snippet like this : (notice frame_bookmark has z-index 100)

<div id="select_bar">
  <div class="frame_bookmark" style="position:absolute;top:1px;left:695px;z-index:100;width:15px;height:15px;background:#df3367;border-radius:10px;">
  </div>
</div>

The alert box is shown when I have JavaScript like 

$("#select_bar").click(function()
{
  alert('down');
});

But not shown when I have JavaScript like: 

$(".frame_bookmark").click(function()
{
  alert('down');
});

Upvotes: 0

Views: 568

Answers (3)

Lewis E.
Lewis E.

Reputation: 337

form my understanding when you call a ID in jquery just like JavaScript it defaults at eq(0).

but when using the attributes class / name you want to specify your indexed numeric for

example

$(".frame_bookmark:eq(0)") / $(".frame_bookmark").eq(0)

and or use the .each function

Upvotes: 0

Anton Boritskiy
Anton Boritskiy

Reputation: 1569

check this out http://jsfiddle.net/ your code is pretty working )

Upvotes: 0

Cliff Ribaudo
Cliff Ribaudo

Reputation: 9039

If the code you posted is exactly your code, your missing a closing </div> which will definitely mess you up. It should be:

<div id="select_bar">
    <div class="frame_bookmark" style="position:absolute;top:1px;left:695px;z-index:100;width:15px;height:15px;background:#df3367;border-radius:10px;"></div>
</div>

Upvotes: 1

Related Questions