<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"
"http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Mouse Events with MochiKit</title>
<link href="mouse_events.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="/MochiKit/MochiKit.js"></script>
<script type="text/javascript" src="mouse_events.js"></script>
</head>
<body>
<h1>
Mouse Events with MochiKit
</h1>
<p>
For a detailed description of what happens under the hood, check out
<a href="mouse_events.js" class="view-source">mouse_events.js</a>.
</p>
<p>
View Source: [
<a href="index.html" class="view-source">index.html</a> |
<a href="mouse_events.js" class="view-source">mouse_events.js</a> |
<a href="mouse_events.css" class="view-source">mouse_events.css</a>
]
</p>
<div id="show-mouse-event" class="scroll-box">
Hover, Click, or Scroll In Me:<br/><br/>
<span id="show-mouse-event-repr"></span>
</div>
<div id="scroll-page" class="scroll-box" style="height: 100px; overflow: scroll;">
Scroll Me and then the page scrolls! <br />
Scroll Me and then the page scrolls! <br />
Scroll Me and then the page scrolls! <br />
Scroll Me and then the page scrolls! <br />
Scroll Me and then the page scrolls! <br />
Scroll Me and then the page scrolls! <br />
Scroll Me and then the page scrolls! <br />
Scroll Me and then the page scrolls! <br />
Scroll Me and then the page scrolls! <br />
Scroll Me and then the page scrolls! <br />
Scroll Me and then the page scrolls! <br />
Scroll Me and then the page scrolls! <br />
Scroll Me and then the page scrolls! <br />
Scroll Me and then the page scrolls! <br />
Scroll Me and then the page scrolls! <br />
Scroll Me and then the page scrolls! <br />
Scroll Me and then the page scrolls! <br />
Scroll Me and then the page scrolls! <br />
Scroll Me and then the page scrolls! <br />
Scroll Me and then the page scrolls! <br />
</div>
<div id="no-scroll-page" class="scroll-box" style="height: 100px; overflow: scroll;">
Scroll Me and then the page does not scroll! <br />
Scroll Me and then the page does not scroll! <br />
Scroll Me and then the page does not scroll! <br />
Scroll Me and then the page does not scroll! <br />
Scroll Me and then the page does not scroll! <br />
Scroll Me and then the page does not scroll! <br />
Scroll Me and then the page does not scroll! <br />
Scroll Me and then the page does not scroll! <br />
Scroll Me and then the page does not scroll! <br />
Scroll Me and then the page does not scroll! <br />
Scroll Me and then the page does not scroll! <br />
Scroll Me and then the page does not scroll! <br />
Scroll Me and then the page does not scroll! <br />
Scroll Me and then the page does not scroll! <br />
Scroll Me and then the page does not scroll! <br />
Scroll Me and then the page does not scroll! <br />
Scroll Me and then the page does not scroll! <br />
Scroll Me and then the page does not scroll! <br />
Scroll Me and then the page does not scroll! <br />
Scroll Me and then the page does not scroll! <br />
</div>
<div class="padding">Ignore me I just make the page big enough to require scrollbars.</div>
<div class="padding">Ignore me I just make the page big enough to require scrollbars.</div>
<div class="padding">Ignore me I just make the page big enough to require scrollbars.</div>
<div class="padding">Ignore me I just make the page big enough to require scrollbars.</div>
<div class="padding">Ignore me I just make the page big enough to require scrollbars.</div>
<div class="padding">Ignore me I just make the page big enough to require scrollbars.</div>
<div class="padding">Ignore me I just make the page big enough to require scrollbars.</div>
<div class="padding">Ignore me I just make the page big enough to require scrollbars.</div>
<div class="padding">Ignore me I just make the page big enough to require scrollbars.</div>
</body>
</html>
