mirror of
https://github.com/bigskysoftware/htmx.git
synced 2025-09-27 04:50:43 +00:00
32 lines
1.1 KiB
HTML
32 lines
1.1 KiB
HTML
<html lang="en">
|
|
<head>
|
|
<meta charset="utf-8" />
|
|
<title>Test Scroll Behavior</title>
|
|
<script src="../../src/htmx.js"></script>
|
|
</head>
|
|
<body style="padding:20px;font-family: sans-serif">
|
|
<script src="../../node_modules/sinon/pkg/sinon.js"></script>
|
|
<script src="../../src/htmx.js"></script>
|
|
<script src="../util/util.js"></script>
|
|
<script>
|
|
server = makeServer();
|
|
server.autoRespond = true;
|
|
server.respondWith("GET", "/demo", "Clicked...");
|
|
htmx.config.scrollBehavior = 'auto';
|
|
</script>
|
|
<h1>Scrolling Start/End Tests</h1>
|
|
|
|
<h3>End</h3>
|
|
<button hx-get="/demo" hx-swap="innerHTML show:#scroll-target:bottom">Scroll Bottom Of Div</button>
|
|
<button hx-get="/demo" hx-swap="innerHTML show:window:bottom">Scroll Bottom Of Window</button>
|
|
<hr/>
|
|
<h3>Start</h3>
|
|
<div id="scroll-target" style="height: 1500px; background-color: red; border: 1px solid black; scroll-margin:10px">
|
|
<h1>Scroll Target</h1>
|
|
</div>
|
|
<button hx-get="/demo" hx-swap="innerHTML show:#scroll-target:top">Scroll Top Of Div</button>
|
|
<button hx-get="/demo" hx-swap="innerHTML show:window:top">Scroll Top Of Window</button>
|
|
|
|
</body>
|
|
</html>
|