I have the following html:

<div class="drop_window">
    <input class="drop_target" type="file" class="crop locale" size="800" />
    <div class="file_name">{{ video.original_file_name }}</div>
</div>

To have the drop_window change color on hover, I can do:

.drop_window:hover {
    background: #F5FFF5;
}

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?

Here is an example of what I currently have: http://jsfiddle.net/5MjGS/

javascript jquery
Edit
Report