HTML | Atributo de evento ondragenter

El atributo de evento ondragenter en HTML funciona cuando el contenido se puede arrastrar. Un elemento se crea estableciendo el valor del atributo arrastrable en verdadero. El atributo arrastrable solo puede tomar un valor verdadero o falso.

Sintaxis:

<element ondragenter = "script">

Valor de atributo: este atributo contiene un script de valor único que funciona cuando se llama al atributo de evento ondragenter.

Ejemplo 1:

<!DOCTYPE html>
<html>
    <head>
        <title>
            HTML ondragenter Event Attribute
        </title>
          
        <!-- script to add background color -->
        <script>
            function MyFunction() {
                document.getElementById("geeks").style.backgroundColor
                            = "green";
            }
        </script>
    </head>
      
    <body id = "geeks" style = "text-align:center">
          
        <!-- ondragenter event call here -->
        <h1 ondragenter = "MyFunction()" draggable = "true">
            GeeksforGeeks
        </h1>
          
        <p>Drag heading content to change background color</p>
    </body>
</html>                    

Salida:
Antes de arrastrar el contenido:

Después de arrastrar el contenido:

Ejemplo 2:

<!DOCTYPE html>
<html>
    <head>
        <title>
            HTML ondragenter Event Attribute
        </title>
          
        <script>
            function dragenter_time() {
                document.getElementById("geeks").innerHTML 
                    = "The date and time is: " + Date();
            }
        </script>
    </head>
      
    <body>
        <center>
              
            <!-- ondragenter event call here -->
            <p id = "geeks" ondragenter="dragenter_time()"
                draggable = "true">Drag to know time
            </p>
        </center>
    </body>
</html>                    

Salida:
Antes de arrastrar el contenido:

Después de arrastrar el contenido:

Navegadores compatibles: los navegadores compatibles con el atributo de evento ondragenter se enumeran a continuación:

  • google cromo 4.0
  • Internet Explorer 9.0
  • Firefox 3.5
  • Safari 6.0
  • Ópera 12.0

Publicación traducida automáticamente

Artículo escrito por roshalmoraes y traducido por Barcelona Geeks. The original can be accessed here. Licence: CCBY-SA

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *