Skip to content
Related Articles

Related Articles

How to make an image draggable in HTML5 ?

Improve Article
Save Article
Like Article
  • Last Updated : 19 Aug, 2021

Drag and drop is a very common and widely used feature in a modern-day website. It simply means to drag an image with the cursor and drop it to any other place. In this article, we are going to learn how to make an image draggable using HTML 5.

Making any HTML5 elements including images draggable is quite easy. We take the help of the ‘draggable’ attribute. It takes true, false, or auto as arguments. The default value is auto. The draggable property depends upon the browser. If we set the value true then the image is draggable. If we set the value false, the image is not draggable. 

Syntax:

<img src="" alt="" draggable="true">

Example:

HTML




<!DOCTYPE html>
<html lang="en">
  <body>
    <h2 style="color: green">GeeksforGeeks</h2>
  
    <p><b>Draggable image</b></p>
  
    <img src=
         alt="image" draggable="true"/>
  </body>
</html>

Output:

Draggable image

My Personal Notes arrow_drop_up
Recommended Articles
Page :

Start Your Coding Journey Now!