Как применить стиль к div, когда перетаскиваешь файл (изображение) в окно браузера?

Question

[Stanislav]

Есть textarea, хочу поверх него вставить блок загрузки изображений "DRAG-AND-DROP" с display:none.
И когда перетаскиваю изображение с раб. стола в окно браузера, то блок стает видимым поверх текстового поля, ну или заменяет его, в общем как вконтакте. Или может это как-то по другому реализовать.

Answer 1

[burtulug]

$('body').on('dragenter', function() {
			$('.drag-and-drop').show();
	});

Comments

[Stanislav]

Спасибо, но думаю я что-то не так делаю. codepen.io/disweb/pen/dpydwz

[burtulug]

Stanislav: Потому что jquery нужен. Без него так: codepen.io/hvost/pen/ambXQk

[Stanislav]

Большое спасибо!
А что дописать чтоб стиль обратно вернулся?
Т.е. чтобы срабатывал только когда наводишь.

[burtulug]

document.addEventListener('dragleave', function(){
document.querySelector('.drag-and-drop').style.display = 'none';
});
Почему-то на codepen работает криво, но вообще работает.

[burtulug]

Вот подробно про все события: https://developer.mozilla.org/en-US/docs/Web/Event...