Learn html - html tutorial - Onwheel attribute in html - html examples - html programs
The onwheel attribute specifies the wheel of a pointing device is rolled up or down over an element.
The onwheel attribute also defines the user scrolls on an element by using a mouse.
The onwheel attribute is a section of the Event Attributes.
Syntax for onwheel attribute in HTML:
<element onwheel ="script">
Difference between HTML 4.01 and HTML 5 for onwheel Attribute:
HTML 4.01
The onwheel attribute does not supported.
HTML 5
The onwheel attribute is added new in HTML 5.
Applies To:
Element
Attribute
All HTML Elements
onwheel
onwheel Attribute Values:
Value
Description
script
The script can run on onwheel.
Sample Coding for onwheel Attribute in HTML:
Tryit<!DOCTYPE html><html><head><title>Wikitechy onwheel attribute</title><style>
#myDIV {
border: 1px solid black;
width: 300px;
height: 150px;
overflow: scroll;
}
</style></head><body><h3>Welcome to Wikitechy.com</h3><h5>Wikitechy technology tutorials</h5><p>To check onwheel attribute scroll down:</p><div id="myDIV" onwheel="OnWheel()">Wikitechy tutorials includes
various technologies like HTML,CSS,GITHUB,ANGULAR JS etc.,<br><br>HTML-Hyper Text Markup Language.HTML is a typical markup
language used for building a web pages.The word "Markup" means a
language with particular syntax which instructs a Web browser to how
the page needs to display. HTML uses a pre-defined set of elements
called tags. A group of elements which is join together to build the
web page. HTML tags defines elements like "paragraph", "body", and so on.
</div><script>
function OnWheel() {
document.getElementById ("myDIV").style. Color = "blue";
}
</script></body></html>
Code Explanation for onwheel Attribute in HTML:
head tag - start with <head> and its end with </head>.
<style> tag is used to set color for a div tag.
#wikitechy id is created to apply for style.
To apply style for border with 2px solid and black color.
<div> tag used to group the elements.
id attribute is used to set red color for the contents inside the <div> tag.
“#myDIV” is used to apply styles to the <div> element.
The onwheel attribute is used to call OnWheel() JavaScript function when the content is rolled down or upwards by mouse wheel.
The JavaScript function OnWheel() is used to display the content in blue color when mouse wheel rolled.
Output for onwheel Attribute in HTML:
The output has been displayed.
When user try to scroll the mouse wheel the font color of <div> is changes to blue.
