MooTools Framework

Somewhat incomplete! Will post a final solution but here are the basics

What?
This article is a quick note to myself on the idea of a slideshow with the MooTools javascript framework. Basically, I want to create a div layer that I can see through (like a window with no glass) and for all the flashy stuff, to only appear within the boundary of the parent div layer.

Why?
I'm making a slideshow from scratch.

How?
The idea is:

Why?
This has taken me too long to figure out and I hope I don't lose this note again. The only website that was titled similarly kept slowing down my computer too much so I decided to work out my own. The complexity is due to content also being dynamically resized in height.

What?
Basically I have a menu in a sidebar, I don't want it to overlap the header nor the footer.I have a content page next to it which changes in height dynamically (a separate mootool function to this one).

How?

Please publish modules in offcanvas position.