board-right-width and board-left-width GSAP

[bluekai]

I want to add a layer(overlay) to the background image.

I want to create a motion that opens from the bottom right to the left.

See the Pen OWEYML by l2zeo (@l2zeo) on CodePen

Is it possible to use overlay as below?

 

See the Pen OWEYML by l2zeo (@l2zeo) on CodePen

[Carl]

I don't think using a 1000px border like that is going to work well with animation.

You might want to look into CSS blend modes https://css-tricks.com/basics-css-blend-modes/ or SVG blend modes.

HTML5 canvas probably offers some good solutions too http://www.gamebzh.net/htmlgame/pixi-e/index.html?s=demos&f=blendmodes.js&title=BlendModes

 

I forked a demo from the CSS-Tricks article and did a very simple animation:

 

 

http://codepen.io/GreenSock/pen/JEBdae