diff options
Diffstat (limited to 'contexts/data/lib/closure-library/closure/goog/demos/mousewheelhandler.html')
-rw-r--r-- | contexts/data/lib/closure-library/closure/goog/demos/mousewheelhandler.html | 109 |
1 files changed, 0 insertions, 109 deletions
diff --git a/contexts/data/lib/closure-library/closure/goog/demos/mousewheelhandler.html b/contexts/data/lib/closure-library/closure/goog/demos/mousewheelhandler.html deleted file mode 100644 index ebbc6c4..0000000 --- a/contexts/data/lib/closure-library/closure/goog/demos/mousewheelhandler.html +++ /dev/null @@ -1,109 +0,0 @@ -<!DOCTYPE html> -<html> -<!-- -Copyright 2010 The Closure Library Authors. All Rights Reserved. - -Use of this source code is governed by the Apache License, Version 2.0. -See the COPYING file for details. ---> -<head> -<title>goog.events.MouseWheelHandler</title> -<link rel="stylesheet" href="../css/checkbox.css"> -<style> -#out { - background-color: #eee; - width: 200px; - height: 200px; - position: relative; -} - -#h-line, #v-line { - position: absolute; - background: black; -} - -#h-line { - width: 20px; - height: 1px; -} - -#v-line { - width: 1px; - height: 20px; -} - -#status { - position: absolute; - bottom: 0; - right: 0; - font: 70% sans-serif; -} - -</style> -<script src="../base.js"></script> -<script> - -goog.require('goog.events'); -goog.require('goog.events.MouseWheelHandler'); - -</script> -</head> -<body> - -<h1>goog.events.MouseWheelHandler</h1> - -<p>Use your mousewheel on the gray box below to move the cross hair. - -<div id=out> - <div id=h-line></div> - <div id=v-line></div> - <div id=status></div> -</div> - -<script> - -var MouseWheelHandler = goog.events.MouseWheelHandler; -var MOUSEWHEEL = MouseWheelHandler.EventType.MOUSEWHEEL; - -function $(id) { - return document.getElementById(id) -} - -var x = 100, y = 100; -var out = $('out'); -var hLine= $('h-line'); -var vLine = $('v-line'); -var status = $('status'); - -var availWidth = out.clientWidth - vLine.offsetWidth; -var availHeight = out.clientHeight - hLine.offsetHeight; - -function handleMouseWheel(e) { - x += e.deltaX / 3; - x = Math.max(0, Math.min(availWidth, x)); - y += e.deltaY / 3; - y = Math.max(0, Math.min(availHeight, y)); - updateLines(); - e.preventDefault(); -} - -function updateLines() { - vLine.style.left = x + 'px'; - hLine.style.left = x - hLine.offsetWidth / 2 + 'px'; - hLine.style.top = y + 'px'; - vLine.style.top = y - vLine.offsetHeight / 2 + 'px'; - status.innerHTML = x + ', ' + y; -} - -updateLines(); - -var mwh = new MouseWheelHandler(out); -goog.events.listen(mwh, MOUSEWHEEL, handleMouseWheel); - -goog.events.listen(window, 'unload', function(e) { - goog.events.unlisten(mwh, MOUSEWHEEL, handleMouseWheel); -}); - -</script> -</body> -</html> |