Skip to main content

Forums

This topic contains 6 replies, has 3 voices, and was last updated by  Shikkediel 4 years ago.

Viewing 7 posts - 1 through 7 (of 7 total)
  • Author
    Posts
  • #206807

    MojoBob
    Participant

    I have a css display/positioning puzzle:

    Is it possible to position an image so that it rests on top of other elements (z-index) but is treated as invisible for the purposes of mousing about underneath?

    In other words, is there an attribute I can set so that it doesn’t prevent access to control elements (like links, buttons etc.) on lower layers?

    #206808

    shaneisme
    Participant

    If you cover things with anything, including an image, using z-index, the stuff beneath it won’t be available to click on.

    But there might be another way of going about what you’re trying to accomplish. Do you have a comp or image that we can look at to see what effect you’re going for?

    #206809

    MojoBob
    Participant

    No, I don’t have a specific project in mind. It’s just something that occasionally trips me up when I think I’ve been clever, and I was hoping it was just my ignorance of some super-secret setting that only the Illuminati know.

    #206810

    shaneisme
    Participant

    Not that I know of, but there are plenty of ways to skin a cat when we’re building this stuff. So the effect might be possible.

    Heck you could change the z-index on hover and the opacity of the stuff “below” to give a similar visual cue.

    Johnny 5 need more input basically.

    #206814

    Shikkediel
    Participant

    is there an attribute I can set so that it doesn’t prevent access to control elements on lower layers?

    I do believe there is such a thing :

    #topelement {
    pointer-events: none;
    }
    
    #206816

    MojoBob
    Participant

    That seems to do the trick — thanks very much. That’ll come in very handy :)

    #206818

    Shikkediel
    Participant

    No problem, keep in mind support is pretty good but IE has only recently implemented it :

    caniuse.com/pointer-events

    You might wanna consider a JS fallback for earlier versions.

Viewing 7 posts - 1 through 7 (of 7 total)

You must be logged in to reply to this topic.

icon-link icon-logo-star icon-search icon-star