Mercurial Hosting > dad

diff src/examples/handle.html @ 3:6d5e4b38b4fb

Find changesets by keywords (author, files, the commit message), revision number or hash, or revset expression.
start drag
author Franklin Schmidt <fschmidt@gmail.com>
date Fri, 21 Apr 2023 00:58:31 -0600
parents
children 332d3e280f7e
line wrap: on
line diff
--- /dev/null	Thu Jan 01 00:00:00 1970 +0000
+++ b/src/examples/handle.html	Fri Apr 21 00:58:31 2023 -0600
@@ -0,0 +1,43 @@
+<!doctype html>
+<html>
+	<head>
+		<meta name="viewport" content="width=device-width, initial-scale=1">
+		<style>
+			@import "/site.css";
+			@import "/dad.css";
+
+			span[handle] {
+				display: inline-block;
+				background-color: LightGreen;
+				padding: 8px;
+			}
+			span[outer] {
+				display: inline-block;
+				background-color: LightBlue;
+				padding: 8px;
+			}
+		</style>
+		<script src="/dad.js"></script>
+		<script>
+			dad.whatToDrag = function(draggable) {
+				return draggable.parentNode;
+			};
+
+			function init() {
+				let span = document.querySelector('span[handle]');
+				dad.setDraggable(span);
+			}
+		</script>
+	</head>
+	<body>
+		<h1>Handle</h1>
+		<p>
+			<span outer>
+				<span handle>drag me</span>
+				along for the ride
+			</span>
+		</p>
+		<p>bottom</p>
+	</body>
+	<script> init(); </script>
+</html>