Make sure you have "roebox.html" and the folder "roebox" on the same level.

Include the following three lines of code in your header:

<link rel="stylesheet" href="roebox/roebox.css" type="text/css" media="screen" />
<script type="text/javascript" src="roebox/mootools.js"></script>
<script type="text/javascript" src="roebox/roebox.js"></script>

Add a rel="roebox" to any link tag.
See source code in this document for any clarification.

<a href="roebox/image1.jpg" rel="roebox" title="title here ">image 1</a>

If you'd like to group a set of related images, just add brackets!
There are no limits to the amount of images in a set.

<a href="roebox/image1.jpg" rel="roebox[setnamehere]">image 1</a>
<a href="roebox/image2.jpg" rel="roebox[setnamehere]">image 2</a>
<a href="roebox/image3.jpg" rel="roebox[setnamehere]">image 3</a>