Blendmode in HTML5??

  • But these days it seems pretty well supported among nearly all modern browsers in HTML5 by my understanding.

    Are you sure?
    What systems/browsers and cases have you tested?

    My tests are showing very different results...
    Beside of not supporting and not working there are often problems, e.g. the blending with the WebGL content behind (the pano) doesn't work or there is a horrible rendering performance...
    And in Chrome the support itself is hidden behind a flag (chrome://flags/#enable-experimental-web-platform-features).

    Btw - you can test that anytime yourself in krpano - e.g.

    Code
    <action name="set_css_blendmode" type="Javascript">
      caller.sprite.style.mixBlendMode = args[1];
    </action>
    
    
    <layer name="test" ... onloaded="set_css_blendmode('multiply');" />

    Best regards,
    Klaus

  • Are you sure?
    What systems/browsers and cases have you tested?


    I'm sure you have tested way more than me and I only did minimal testing myself. My conclusion was based mostly on websites. For instance: Blend Mode Adoption. Microsoft is the real laggard, unfortunately. And Safari support only partial.

    But with your js action I get what I want to the degree it is available. Once again you demonstrate amazing flexibility of KRPano. Perhaps down the line, with more universal support, it can become a standard feature.

    Thanks!

  • I have also quickly redone my own tests (only Windows and iOS now):

    1. Chrome 53 - still only behind a flag
    2. Chrome 53 - blends only between html elements, but not with the WebGL canvas (the pano)
    3. Firefox 48b3 - rendering performance is great now (last time it was horrible)
    4. Firefox 48b3 - when using it with CSS3D hotspots there are rendering errors
    5. IE11/Edge - no support
    6. iOS9/iOS10 - blend only between html elements
    Quote

    But with your js action I get what I want to the degree it is available. Once again you demonstrate amazing flexibility of KRPano.

    *wink*

Participate now!

Don’t have an account yet? Register yourself now and be a part of our community!