How To Make Svg Change Color On Hover Code Example


Example 1: how to change svg image color on hover using css


svg {    width: 100px;    height: 100px;}svg:hover path {    fill: red;}

Example 2: how to change svg image color on hover using css


/*  * Replace all SVG images with inline SVG  */ $(function() {$('img.svg').each(function() {         var $img = $(this);         var imgID = $img.attr('id');         var imgClass = $img.attr('class');         var imgURL = $img.attr('src');$.get(imgURL, function(data) {             // Get the SVG tag, ignore the rest             var $svg = $(data).find('svg');// Add replaced image's ID to the new SVG             if (typeof imgID !== 'undefined') {                 $svg = $svg.attr('id', imgID);             }             // Add replaced image's classes to the new SVG             if (typeof imgClass !== 'undefined') {                 $svg = $svg.attr('class', imgClass + ' replaced-svg');             }// Remove any invalid XML tags as per http://validator.w3.org             $svg = $svg.removeAttr('xmlns:a');// Replace image with new SVG             $img.replaceWith($svg);}, 'xml');});})

Comments

Popular posts from this blog

Converting A String To Int In Groovy

"Cannot Create Cache Directory /home//.composer/cache/repo/https---packagist.org/, Or Directory Is Not Writable. Proceeding Without Cache"

Android How Can I Convert A String To A Editable