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
<div class="canvas"> <script>register('distance')</script> </div> Urazil jsi <span id="distance">??</span> pixelů.
HTML
Autoformát
Standardní režim
Mobilní zobrazení
.canvas { width: 200px; height: 200px; background: yellow; }
CSS
Autoformát
CSS reset
Až na konci
window.onload = function() { window.mouseDown = 0; document.body.onmousedown = function() { window.mouseDown = 1; }; document.body.onmouseup = function() { window.mouseDown = 0; }; }; function register(result) { var els = document.getElementsByTagName('script'); var el = els[els.length-1].parentNode; var pos; function down(ev) { ev = ev || window.event; pos = {x: ev.clientX, y: ev.clientY}; } function up(ev) { ev = ev || window.event; var dist = "??"; if (pos !== undefined) { dist = Math.sqrt( (pos.x-ev.clientX)*(pos.x-ev.clientX) + (pos.y-ev.clientY) * (pos.y-ev.clientY)); } pos = undefined; document.getElementById(result).innerHTML = dist; } function out(ev) { if (window.mouseDown) { up(ev); } } function over(ev) { if (window.mouseDown) { down(ev); } } el.onmousedown = down; el.onmouseup = up; el.onmouseout = out; el.onmouseover = over; }
J
ava
S
cript
Autoformát
jQuery
Umístění JS
window.onload
</head>
</body>