Hallo, mau coba buat sample program ah di blogspot, contoh tema yang diambil kali ini adalah ambil URL gambar pake metode Drag and Drop menggunakan Javascript Murni, fix hanya di satu browser saja kalo drag beda browser gak bisa >.<
CSS
- #dropbox {
- border: 3px dashed black;
- width: 200px;
- height: 30px;
- }
#dropbox {
border: 3px dashed black;
width: 200px;
height: 30px;
}
Javascript
- window.onload = function() {
- var dropbox = document.getElementById('dropbox');
- dropbox.addEventListener('drop', drop, false);
- function drop(evt) {
- evt.stopPropagation();
- evt.preventDefault();
- var imageUrl = evt.dataTransfer.getData('URL');
- alert("Nih Link-nya \n"+imageUrl);
- }
- }
//<![CDATA[
window.onload = function() {
var dropbox = document.getElementById('dropbox');
dropbox.addEventListener('drop', drop, false);
function drop(evt) {
evt.stopPropagation();
evt.preventDefault();
var imageUrl = evt.dataTransfer.getData('URL');
alert("Nih Link-nya \n"+imageUrl);
}
}
//]]>;
HTML
- <div id="dropbox" ondrop="drop(event);" ondragover="return false">Taruh Image disini </div>
<div id="dropbox" ondrop="drop(event);" ondragover="return false">Taruh Image disini </div>
Sumber Terkait :
JSFiddle
Contoh Program
Taruh Image disini
Tidak ada komentar:
Posting Komentar
Perhatian! Silahkan berkomentar tanpa ada unsur SARA ^_^