canvas
body{
font-family:宋体,Arial, Helvetica, sans-serif;
font-size: 80%;
}
#dp{
width:200px;
min-height:70px;
border:1px solid #000;
background-color:#eee;
padding:1em;
margin:2em;
}
#dp img{
margin-right:1em;
}
(function(){
// 拖动区域的div元素
var dp = null;
// FileReader接口对象
var reader = null;
/*--------------------
*页面导入时处理
---------------------*/
window.addEventListener("load", function(){
dp = document.getElementById('dp'); // 拖动区域的div元素
dp.addEventListener("dragover",function(evt){ // 设置dragover事件的事件监听
evt.preventDefault();
},false);
dp.addEventListener("drop",function(evt){ // 设置drop事件的时间监听
evt.preventDefault();
//console.log(evt)
file_droped(evt);
},false);
},false);
/*--------------------
*文件被拖入时处理
---------------------*/
function file_droped(evt){
while( dp.firstChild ){ // 清空
如果觉得《HTML黑白触摸变彩色 使用HTML5 转换彩色图片为黑白色知识讲解.doc》对你有帮助,请点赞、收藏,并留下你的观点哦!