JavaScript Cursor property



The cursor property is sets or returns the cursor type that will be displayed for the cursor property.

Following is the code for implementing JavaScript Cursor property βˆ’

Example

 Live Demo

<!DOCTYPE html>
<html>
<head>
<style>
   body {
      font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;
   }
</style>
</head>
<body>
<h1>JavaScript Cursor property</h1>
<p class="sample"></p>
<h3>
Hover the mouse over the above paragraph after clicking the below button
</h3>
<button class="Btn">Change Cursor</button>
<script>
   let sampleEle = document.querySelector(".sample");
   document.querySelector(".Btn").addEventListener("click", () => {
      sampleEle.style.cursor = "crosshair";
});
</script>
</body>
</html>

Output

On clicking the β€œChange Cursor” button βˆ’

Updated on: 2020-05-08T11:05:17+05:30

194 Views

Kickstart Your Career

Get certified by completing the course

Get Started
Advertisements