ipixel
ipixel

Reputation: 529

z-index or jquery issue

So i'm trying to create an action where once a button is clicked the website get's covered by a transparent div and that div itself contains a box into which i'll put some content.

Here's what i've put together so far.

http://jsfiddle.net/6q8815p7/

When you click the get started button it triggers this:

$('.getStarted').click

At that point, i figure out how large the webFade div should be, and show it along with another box inside.

But my issue is, i want the whole thing to hide when the black background is clicked, but NOT when the white box is clicked. I've been messing with z-indexes but no matter what i try, when i click on the white box, the $('.webFade').click() function get's triggered anyway.

I'm not sure if my issue is with my CSS/z-index or if my jquery approach to it is wrong.

Any pointers would be much appreciated.

Thanks!

Upvotes: 0

Views: 32

Answers (1)

Robert
Robert

Reputation: 21388

You just want to stop propagation of the event through quickstart.

Add this to the method.

$('.quickStart').click(function (e) {
    e.stopPropagation();
});

Seen here http://api.jquery.com/event.stoppropagation/

Upvotes: 1

Related Questions