CODEWITHSUNDEEP
javascriptjqueryhtmlcss
Tommy
Tommy

Reputation: 8178

html/css/jquery click through elements and all trigger events

Assuming that I have 1 button "Red" and multiple buttons behind:

<button type="button">Red</button>
<button type="button">ABC</button>
<button type="button">DEF</button>
<button type="button">GHI</button>
<button type="button">JKL</button>

Somehow, they are stacked on each others. But button "Red" is on top.

enter image description here

Would it be possible that clicking on "Red" will trigger events on itself and on all buttons behind?

Using CSS "pointer-events:none;" therefore doesn't work here. As well this is a general case, so using jQuery selectors to manually select and trigger them should be ruled out.

Upvotes: 2

Views: 318

Answers (2)

Haiz
Haiz

Reputation: 171

Try putting them in css class. If you want to use javascript jquery, do .click() and activate all of them

Upvotes: 0

Felix
Felix

Reputation: 38102

You can use trigger() to trigger the click event of green and blue button when you click on redbutton:

$('button.red').click(function () {
    $('button.green').trigger('click'); // or .click()
    $('button.blue').trigger('click'); // or .click()
});

Fiddle Demo

Upvotes: 1

Related Questions