You can use a small style block in the template head to control the display; perhaps setting the position of the a tags something like this:
<style>
.orbit-gallery {position:relative;}
.orgit-gallery a{display:block;position:absolute;
}
</style>
Adjust the top and left or right of the a blocks as necessary.
This is just one idea off the top of my head. There are any number of ways to do this. You might even try the overflow:hidden as an inline style for the .orbit-gallery div. I don't generally approve of inline styles, but there are times when they server a purpose.
Keep in mind that most if not all Javascript files should be loaded at the bottom of the page, just before the closing body tag. Loading javascript causes the rest of the content to wait until the file has been fetched and loaded.
You also might want to change that window.load function to document.ready function; then the javascript controlling the images will start working sooner. It's a JQuery abstraction of the DOMContentLoaded javascript function that emulates it if the browser doesn't support it. This means the javascript will start working as soon as the basic HTML structure is built, without waiting for everything, including all images, to fully load.