title: Set up two divs as a dragable areas with HTML5
body: <p>Hi there HTML5 developers, I am trying to set up two different divs to be the dragable area for the incoming file. However, it seems that only one of those can be active at a time, how can I make them both ready to accept the dnd of the file. This is the code I have:</p>
  
  <pre><code>var node = dojo.byId("welcomeDialog1_Id");
  var node2 = dojo.byId("firstDialogBackground");
      // Reference
      // http://www.html5rocks.com/features/file
      // http://www.html5rocks.com/tutorials/dnd/basics/
      // https://developer.mozilla.org/En/DragDrop/Drag_Operations
      dojo.connect(node, "dragenter", function(evt){
          // If we don't prevent default behavior here, browsers will
          // perform the default action for the file being dropped i.e,
          // point the page to the file.
          evt.preventDefault();
      });
  
      dojo.connect(node, "dragover", function(evt){
          evt.preventDefault();
      });
      dojo.connect(node, "drop", handleDrop);
  
  
  
    dojo.connect(node2, "dragenter", function(evt){
          evt.preventDefault();
      });
  
      dojo.connect(node2, "dragover", function(evt){
          evt.preventDefault();
      });
      dojo.connect(node2, "drop", handleDrop);
  </code></pre>