CSS3 Transition Text Glows on Mouseover - Add a CSS3 transition text that glows when the visitors mouse hovers over it.
Example: View Code Demo
!DOCTYPE html> <html> <head> <title>HTML5 CSS3 Transition Text Glows on Mouseover</title> <style> /* Begin HTML5 CSS3 Transition Text Glows on Mouseover */ /* == This Script Free To Use Providing This Notice Remains == */ /* == This Script Has Been Found In The https://snapbuilder.com Free Public Codes Library == */ /* == NOTICE:Though This Material May Have Been In A Public Depository, Certain Author Copyright Restrictions May Apply == */ BODY {font-family:verdana,arial,ms sans serif; font-size:90%; background-color:#000000; color:#ffffff;} #wrapper {margin:0; padding:15px 15px 15px 15px;} .text-glow{ font-size:4em; color:#ffffff; font-family:Arial; } .text-glow:hover, .text-glow:focus .text-glow:active{ -webkit-stroke-width:5.3px; -webkit-stroke-color:#ffffff; -webkit-fill-color:#ffffff; text-shadow:1px 0px 20px yellow; -webkit-transition:width 0.3s; /*Safari & Chrome*/ transition:width 0.3s; -moz-transition:width 0.3s; /* Firefox 4 */ -o-transition:width 0.3s; /* Opera */ } .text-glow a{ -webkit-transition:all 0.3s ease-in; /*Safari & Chrome*/ transition:all 0.3s ease-in; -moz-transition:all 0.3s ease-in; /* Firefox 4 */ -o-transition:all 0.3s ease-in; /* Opera */ text-decoration:none; color:#ffffff; } </style> </head> <body> <div id="wrapper"> <h3 align="center">HTML5 CSS3 Transition Text Glows on Mouseover</h3> <div class="text-glow" align="center"><a href="#">This Text Glows On Mouseover</a></div> <br /><br /> <div align="center"> [ This code example from <a href="http://snapbuilder.com/code_snippets/copy_code_snippet_210.html">HTML5 CSS3 Transition Text Glows on Mouseover Code Snippet</a> page. ] </div> </div> </body> </html>