Hier der Javascript Code dafür (benötigt Mootools 1.2)
<script type="text/javascript">
Page = {
getSize: function() {
x = 0, y = 0
if (self.innerHeight) {
x = self.innerWidth;
y = self.innerHeight;
} else if (document.documentElement && document.documentElement.clientHeight) {
x = document.documentElement.clientWidth;
y = document.documentElement.clientHeight;
} else if (document.body) {
x = document.body.clientWidth;
y = document.body.clientHeight;
}
return {height: y, width: x};
}
};
window.addEvent('domready', function() {
$('menu').setStyles({
'width': '0px'
});
$('frame').setStyles({
'right': '10px'
});
var slidefx = new Fx.Tween($('menu'), { link: 'cancel', duration: 'short' });
var active = false;
var slidein = function() {
slidefx.start('width', 0);
};
var slideout = function() {
slidefx.start('width', 120);
};
var mousemovehandler = function(event) {
if (!event.page) {
if (active) {
active = false;
slidein();
}
return;
}
var diff = Page.getSize().width - event.page.x;
if (diff <= parseInt($('menu').getStyle('width')) + 10 && !active) {
active = true;
slideout();
} else if (diff > 120 && active) {
active = false;
slidein();
}
};
var getwindow = function(iframe) {
if (iframe.contentDocument && iframe.contentDocument.defaultView) {
return iframe.contentDocument.defaultView;
} else {
return iframe.ownerDocument.parentWindow;
}
};
window.addEvent('mousemove', mousemovehandler);
(function() {
try {
var window = getwindow($('frame').getElement('iframe'));
if (window.removeEventListener) window.removeEventListener('mousemove', mousemovehandler, true);
else this.detachEvent('onmousemove', mousemovehandler);
if (window.addEventListener) window.addEventListener('mousemove', mousemovehandler, true);
else this.attachEvent('onmousemove', mousemovehandler);
} catch (e) {
}
}).periodical(10);
});
</script>