title: IE 10 drag and drop still opening the file eventhough there is dragover event
body: <p>on IE 10, everytime I drag the file to the upload filed, it still opening the file. how to prevent this? I'm confused. Please help. Is the cause due to the drag and drop is "in the file upload field" instead of creating another div tag drop area? Is there anyway to make it work on the upload field?</p>
  
  <pre><code>                &lt;div id="dnd-upload-box"&gt;
                  &lt;img id="image" src="https://upload.dev/img/elements/drag_drop.jpg" width="100%" height="100%"/&gt;
                  &lt;?php
                      echo $this-&gt;Form-&gt;input('files', array(
                          'id'        =&gt; 'file-input-0',
                          'class'     =&gt; 'file-input',
                          'type'      =&gt; 'file', 
                          'multiple'  =&gt; 'multiple',
                          'name'      =&gt; 'fileselect[]', 
                          'onChange'  =&gt; 'getFiles(this);'
                      ));     
                  ?&gt;      
                  &lt;/div&gt;
  
  
  &lt;script type="text/javascript"&gt;
      // call initialization file
      $(document).ready(function() {
          Init();
      });
  
      // getElementById
      function $id(id) {
          return document.getElementById(id);
      }   
  
      // initialize
      function Init() {               
          var filed = $id("file-input-0");
          filed.addEventListener("dragenter", FileDragHover, false);
          filed.addEventListener("dragover", FileDragHover, false);
          filed.addEventListener("dragleave", FileDragHover, false);
          //filed.addEventListener("drop", FileSelectHandler, false);
  
      }   
  
      function FileSelectHandler(e) {
          // cancel event and hover styling
          console.log("selecthandler");
          FileDragHover(e);
          getFiles(e);
      }   
  
      // file drag hover
      function FileDragHover(e) {
          console.log("draghover");
          e.stopPropagation();
          e.preventDefault();
          e.target.className = (e.type == "dragover" ? "hover" : "");
      }   
  &lt;/script&gt;
  </code></pre>