<?php
if(isset($_FILES['image']['tmp_name'])){
move_uploaded_file($_FILES['image']['tmp_name'],'asset/img/01.png');
}
?>
<!Doctype html>
<html>
<head>
<meta charset="UTF-8">
<style>
#drag-drop-area{
background-color:#e6e6fa;
padding:15px;
}
.drag-drop-inside{
text-align:center;
border: dashed 1px gray;
padding: 5px;
}
</style>
</head>
<body>
<form action="#" method="POST" enctype="multipart/form-data">
<div id="drag-drop-area">
<div class="drag-drop-inside">
<p class="drag-drop-info">ここにファイルをアップロード</p>
<p>または</p>
<!-- <input type="file" value="ファイルを選択" name="image"> -->
<p class="drag-drop-buttons"><input id="fileInput" type="file" value="ファイルを選択" name="image"></p>
<input type="submit" value="送信">
</div>
</div>
</form>
<script>
var fileArea = document.getElementById('drag-drop-area');
var fileInput = document.getElementById('fileInput');
fileArea.addEventListener('dragover', function(evt){
evt.preventDefault();
fileArea.classList.add('dragover');
});
fileArea.addEventListener('dragleave', function(evt){
evt.preventDefault();
fileArea.classList.remove('dragover');
});
fileArea.addEventListener('drop', function(evt){
evt.preventDefault();
fileArea.classList.remove('dragenter');
var files = evt.dataTransfer.files;
fileInput.files = files;
});
</script>
</body>
</html>
うお、思ってたよりカッケー
で、これを当てはめたい
まー及第点でしょう。。
