Sha256: 7f42add338e9e50f3c580199028291635ae656b3915d5117057f0b27a74afbd3
Contents?: true
Size: 1.63 KB
Versions: 8
Compression:
Stored size: 1.63 KB
Contents
<!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.fx.Dragger</title> <script src="../base.js"></script> <script> goog.require('goog.events'); goog.require('goog.events.EventType'); goog.require('goog.fx.Dragger'); goog.require('goog.fx.Dragger.EventType'); </script> <link rel="stylesheet" href="css/demo.css"> <style> #stopper { position: absolute; padding: 5px; right: 20px; top: 20px; width: 100px; height: 100px; background: pink; border: 1px solid red; } #out { display: inline; background: #eee; border: 1px solid #ddd; padding: 5px; } </style> </head> <body> <h1>goog.fx.Dragger</h1> <p>This demo shows how to use a dragger to capture mouse move events. It tests that you can drag things outside the window and that alerts ends the dragging. <h2 id=test onclick="alert('Click')">Drag me</h2> <pre id=out>Status</pre> <div id=stopper onmouseover="alert('Stop!')">Drag over me to generate an alert</div> <script> function update(e) { print(e.clientX + ', ' + e.clientY); } function print(s) { document.getElementById('out').innerHTML = s; } var testEl = document.getElementById('test'); goog.events.listen(testEl, goog.events.EventType.MOUSEDOWN, function(e) { var d = new goog.fx.Dragger(testEl); d.addEventListener(goog.fx.Dragger.EventType.DRAG, function(e) { update(e); }); d.addEventListener(goog.fx.Dragger.EventType.END, function(e) { print('finish'); d.dispose(); }); d.startDrag(e); }); </script> </body> </html>
Version data entries
8 entries across 8 versions & 3 rubygems