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 id="upload" ondrop="zpracovat(event)"></div> <div id="nahledy"></div>
HTML
Autoformát
Standardní režim
Mobilní zobrazení
body { background: #000; } #upload { background: #fff; width: 100px; height: 100px; }
CSS
Autoformát
CSS reset
Až na konci
function prevent(e) { e = e || event; e.preventDefault(); } window.addEventListener("dragover", prevent, false); window.addEventListener("drop", prevent, false); function zpracovat(e) { var soubory = e.dataTransfer.files; for (var i = 0; i < soubory.length; i++) { nacist(soubory[i]); } } var nahledy = document.getElementById("nahledy"); function nacist(soubor) { var reader = new FileReader(); reader.onload = function (e) { var obrazek = document.createElement("img"); obrazek.src = e.target.result; nahledy.appendChild(obrazek); }; reader.readAsDataURL(soubor); }
J
ava
S
cript
Autoformát
jQuery
Umístění JS
window.onload
</head>
</body>