Nová ukázka
Reset
Načíst z URL
Uložit a získat odkaz
Vztahuje se k…
Nevyplňujte
Napiště „nejsem robot“
▶
Přepnout zobrazení
Výsledek
<title>Zjištění směru rolování kolečka</title> <body onmousewheel="zoom(event)"> <h1>Směr rolování kolečka</h1> <p id="smer"></p> <div id="text">test</div>
HTML
Autoformát
Standardní režim
Mobilní zobrazení
html, body { height: 100%; } div{ height:50; border:1px solid black; }
CSS
Autoformát
CSS reset
Až na konci
if (document.addEventListener) { document.body.addEventListener("DOMMouseScroll", zoom, false); } function zoom(e) { e = e || window.event; var sjednocenySmer = e.wheelDelta || -e.detail; var smer = Math.max(-1, Math.min(1, sjednocenySmer)); vypsat(smer); } function vypsat(smer) { var vyska = document.getElementById('text').offsetHeight; var pohyb = (smer == 1) ? "nahoru" : "dolů"; if(pohyb == "nahoru" && vyska <= 300){ document.getElementById('text').style.height = vyska + 20 +"px"; } else if(pohyb == "dolů" && vyska >= 20 ){ document.getElementById('text').style.height = vyska - 20 +"px"; } }
J
ava
S
cript
Autoformát
jQuery
Umístění JS
window.onload
</head>
</body>