Forums

The forums ran from 2008-2020 and are now closed and viewable here as an archive.

Home Forums CSS Tear drop (mask?)

  • This topic is empty.
Viewing 8 posts - 16 through 23 (of 23 total)
  • Author
    Posts
  • #119444
    chrisburton
    Participant

    @dfogge Incredible, thank you! Is there any possible way to support IE9+?

    #119446
    Andy Howells
    Participant

    Am I right in saying that this code basically;

    • Replaces the image src with the mask.
    • Adds a CSS background of the original image to the element.
    • Mask has a hole in it in the shape of what you want? (Transparent).
    #119447
    chrisburton
    Participant

    Even if that’s the case, the way my markup has to be (inline images), it works perfectly for using the Twitter API and masking the avatars. If somehow I could support IE9+, my problem would be solved.

    #119449
    dfogge
    Participant

    yes, that is indeed what its doing andy. the catch is your background needs to be a solid color and match the color of the mask.

    chris, i’m not sure why the codepen demo is not working in IE, but check it out in the original author’s jsfiddle demo: http://jsfiddle.net/rjzaworski/dpetM/3/

    looking good to me on ie8, 9 and 10.

    i remember when i used it i didnt have any issues with IE, and this was when i was still testing for ie7.

    #119450
    chrisburton
    Participant

    Ah, thanks for saving the day @dfogge.

    #119451
    Andy Howells
    Participant

    @chrisburton – Working fine for me in IE8-10.


    @dfogge
    – cheers for confirming for me, just was trying to wrap my head around what the JavaScript was actually doing.

    #119452
    dfogge
    Participant

    all credit due to RJ Zaworski, but glad to help!

    #119457
    chrisburton
    Participant

    @andy_unleash Yeah, for some reason I had compatibility mode on.

Viewing 8 posts - 16 through 23 (of 23 total)
  • The forum ‘CSS’ is closed to new topics and replies.