Change size and color of text on mouse hover using HTML CSS and JavaScript

By Bhavna Mankar

When we hover over the text. It increase the size of text as well as change the color of text. With the HTML, CSS, and JavaScript.

Cursor Effect Using HTML, CSS, and JavaScript 

 

Cursor effect with the help of HTML,CSS and JavaScript. I am using mouseover and mouseleave event which is used in JavaScript. When we move the mouse over the text size of the cursor is increase as well as the color of the text increase. This is the JavaScript code for the mouseover and mouseleave.

main.addEventListener("mousemove",function(valu){
curss.style.left=(valu.x + 15) +"px";
curss.style.top=(valu.y + 15) + "px";

});

naame.addEventListener("mouseover",function(){
   curss.style.scale=2;
})


curss.addEventListener("mouseleave",function(){
    curss.style.scale=1;
})

 

This is the outcome of the source code. You can also download the source code.