CODEWITHSUNDEEP
javascriptjquerytransparencyopaque-pointers
Mr. Lavalamp
Mr. Lavalamp

Reputation: 1888

Detect transparency in div for .click purposes?

I've got three elements layered on top of one another, and each of them contains some transparency. There is no transparency in the middle, just around the edges. I want to be able to click the div in the background, but because the transparent space leading to the edge of the frontmost div is over it, instead the click event for that frontmost div fires. I can't disable it or use stopPropegation() obviously, because the one in front still needs to be clickable.

Are there any solutions for detecting transparent space and differentiating it from opaque space? Thanks!

Upvotes: 0

Views: 116

Answers (1)

user571545
user571545

Reputation:

This might not work, but the best I can think of - it assumes the further back divs are children of the front divs:

    $('div').click(function() {
        if($(this).css('opacity') != 1) {
            //it's transparent
           $(this).children('div').click();
        }
    });

    //mouse coordinates
    $('div#innerDiv').click(function(e) {
        var x = e.pageX;
        var y = e.pageY
    });

Upvotes: 1

Related Questions