What is HTML ondrag Event Attribute?

In this article, we will learn HTML ondrag Event Attribute,This free HTML tutorial for complete beginners will help you learn HTML from scratch.

HTML ondrag Event Attribute

Q: How to use HTML ondrag Event Attribute in HTML?

The ondrag event attribute triggers when the element or text selection is being dragged in HTML

HTML | onwheel Event Attribute

HTML ondragend Event Attribute

The ondrag event attribute triggers when the element or text selection is being dragged in HTML. This event is very similar to the drag-and-drop event. This will triggered during a drag operation when an HTML element is being dragged.

Syntax

<element ondrag = "script">

Supported Tags

It supports all HTML Elements.

Attribute Value

This attribute contains a single value script that works when an element is dragged. It is supported by all HTML elements.

Example: This example illustrates the implementation of the HTML ondrag Event Attribute.

HTML

<!DOCTYPE html>
<html>
 
<head>
    <title>ondrag event attribute</title>
    <style>
        body {
            text-align: center;
        }
 
        #Beginner {
            border: 1px solid black;
            padding: 15px;
            width: 60%;
        }
    </style>
</head>
 
<body>
    <h1 style="color:green">
        w3wiki
    </h1>
    <h2>
        ondrag event attribute
    </h2>
    <div id="Beginner"
         draggable="true"
         ondrag="Function()">
        w3wiki: A computer 
        science portal for Beginner
    </div>
 
    <script>
        function Function() {
            document.getElementById("Beginner").
                style.fontSize = "30px";
            document.getElementById("Beginner").
                style.color = "green";
        }
    </script>
</body>
 
</html>