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>Nakreslení nahrávaného obrázku před nahráním na server</title> <h1>Nakreslení nahrávaného obrázku do <code><canvas></code>u</h1> <p>Nefunguje v IE.</p> <canvas id="cc"></canvas> <form> <input type='file' onchange="zobrazit(this)" > </form>
HTML
Autoformát
Standardní režim
Mobilní zobrazení
CSS
Autoformát
CSS reset
Až na konci
var canvas = document.getElementById("cc"); var ctx = canvas.getContext("2d"); function zobrazit(input) { if (input.files && input.files[0]) { var reader = new FileReader(); reader.onload = function (e) { var obrazek = new Image(); obrazek.src = e.target.result; canvas.width = obrazek.width; canvas.height = obrazek.height; ctx.drawImage(obrazek, 0, 0); }; reader.readAsDataURL(input.files[0]); } }
J
ava
S
cript
Autoformát
jQuery
Umístění JS
window.onload
</head>
</body>