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
<!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 −