Este atributo funciona cuando la rueda del dispositivo de puntero se desplaza hacia arriba o hacia abajo sobre un elemento. El atributo onwheel también funciona cuando el usuario se desplaza o hace zoom en un elemento con el mouse o el panel táctil.
Etiquetas compatibles: admite todos los elementos HTML.
Sintaxis:
<element onwheel = "script">
Valor de atributo: este atributo contiene un script de valor único y funciona cuando se llama al atributo onwheel. Es compatible con todos los elementos HTML.
Nota: este atributo es nuevo en HTML 5.
Ejemplo:
html
<!DOCTYPE html>
<html>
<head>
<title>onwheel event attribute</title>
<style>
#geeks {
border: 1px solid black;
padding:15px;
width:60%;
}
h1 {
color:green;
}
</style>
</head>
<body>
<center>
<h1>GeeksforGeeks</h1>
<h2>onwheel event attribute</h2>
<div id = "geeks" onwheel="Function()">GeeksforGeeks:
A computer science portal for geeks</div>
<script>
function Function() {
document.getElementById("geeks").style.fontSize = "30px";
document.getElementById("geeks").style.color = "green";
}
</script>
</center>
</body>
</html>
Salida:
Antes:
Después:
Navegadores compatibles: los navegadores compatibles con el atributo de evento onwheel se enumeran a continuación:
- cromo 31.0
- Internet Explorer 9.0
- Firefox 17.0
- Safari: no compatible
- Ópera 18.0