HTML Drag and Drop API

Learn how to use the HTML Drag and Drop API, which enables applications to use the drag-and-drop feature (natively) in the browser, making it easier for developers to create interactive experiences for users!

Using The HTML Drag and Drop API, we can customize which elements can become draggable and/or droppable, and define the transferred data.

In this video, we use the HTML Drag and Drop API in order to create a simple Drag and Drop matching game. In the first few minutes, we build the structure and add the content and styling with HTML and CSS and we then proceed to implementing the Drag and Drop functionality with the help of drag-and-drop related events in JavaScript!

Enjoy ?

Don’t forget to share, like, subscribe and would love to hear your thoughts in the comment section below!

Code for this Project: https://codepen.io/Coding_Journey/pen/YzKpLvE
Code for Second Example: https://codepen.io/Coding_Journey/pen/JjPbvqJ
Code for Drag and Drop Game: https://codepen.io/Coding_Journey/pen/LYPNmpe

Support the Channel ?☕?
PayPal: https://paypal.me/CodingJourney

Suggested Videos:
Voice Search with JavaScript (Web Speech API): https://www.youtube.com/watch?v=kagZyM0wzJk
Font Awesome 5 Icons: https://www.youtube.com/watch?v=rXiO4bm2Zpc
Arrow Swipe Game with HTML, CSS and JavaScript: https://www.youtube.com/watch?v=SogoaFv2CRQ&list=PLdGqEpyfYoMAYRa97MgWMlfJlbSJbxZXp
Currency Converter with HTML, CSS and JavaScript: https://www.youtube.com/watch?v=ARBvYDNeNdM&list=PLdGqEpyfYoMCSMLcavLm4BmTiZoBnme-O
Decide - Create - Publish - Repeat: https://www.youtube.com/watch?v=5Uq_m_CbzEI
CSS box-shadow Editor: https://www.youtube.com/watch?v=EBbgImXJeqY

Codepen: https://codepen.io/Coding_Journey/
Twitter: https://twitter.com/CodingJrney
Email: [email protected]

Subscribe ?
https://www.youtube.com/channel/UCwpH4liYtBSiVXSfL8x2TyQ?sub_confirmation=1