css animate svg circle radius
<html> <head> <link href = "styling.css" rel = "stylesheet" type = "text/css"></link> </head> <body> <svg class = "button" expanded = "true" height = "100px" width = "100px"> <circle cx = "50%" cy = "50%" r = "35%" stroke = "#000000" stroke-width = "10%" fill = "none"/> <circle class = "innerCircle" cx = "50%" cy = "50%" r = "25%" fill = "#000000"> <animate attributeName="r" begin="0s" dur="1s" repeatCount="indefinite" from="5%" to="25%"/> </circle> </svg> </body> </html>
Source: stackoverflow.com