File-drop hover like gmail
<p>I have the following html:</p>

<pre><code>&lt;div class="drop_window"&gt;
    &lt;input class="drop_target" type="file" class="crop locale" size="800" /&gt;
    &lt;div class="file_name"&gt;{{ video.original_file_name }}&lt;/div&gt;
&lt;/div&gt;
</code></pre>

<p>To have the drop_window change color on hover, I can do:</p>

<pre><code>.drop_window:hover {
    background: #F5FFF5;
}
</code></pre>

<p>However, if I try and drag a file into that drop_window, it does not change color. How would I make it do so, similar to Gmail's file-drop functionality?</p>

<p>Here is an example of what I currently have: <a href="http://jsfiddle.net/5MjGS/" rel="nofollow">http://jsfiddle.net/5MjGS/</a></p>
