Item: ExampleEdit
Rating: 3.4
Author: parkerhutchinson

0 Downloads
0 Views
Tweet
Download Now View Demo

HTML
CSS
JavaScript

    <!-- Learn about this code on MDN: https://developer.mozilla.org/en-US/docs/Web/SVG/Element/linearGradient -->

<svg width="120" height="120" xmlns="http://www.w3.org/2000/svg">
    <defs>
        <linearGradient id="MyGradient">
            <stop offset="5%"  stop-color="green"/>
            <stop offset="95%" stop-color="gold"/>
        </linearGradient>
    </defs>

    <circle class="circle" stroke="url(#MyGradient)" fill="white"
          cx="50" cy="50" r="20" stroke-width="3" />
</svg>


/*Downloaded from https://www.codeseek.co/parkerhutchinson/exampleedit-ZXNxom */
    svg .circle{
  stroke-dasharray: 150;
  stroke-dashoffset: 150;
  animation: dash 2s linear alternate infinite;
}

@keyframes dash {
  from {
    stroke-dashoffset: 150;
  }
  to {
    stroke-dashoffset: 0;
  }
}


/*Downloaded from https://www.codeseek.co/parkerhutchinson/exampleedit-ZXNxom */

Comments

More from parkerhutchinson

ExampleEdit

In this example below you will see how to do a ExampleEdit with some HTML / CSS and Javascript

Comments

More from parkerhutchinson

A Pen by Parker Hutchinson

A Pen by Parker Hutchinson

A Pen by Parker Hutchinson

A Pen by Parker Hutchinson

You Might Also Like

Image add SlideBox Sample ver 0.3 (ionic ver 0.9.27)

FreeCodeCamp: Portfolio

CSS Style encapsulation

Syria flag animation fixed logo #css, #html

UXD Animation

Global.css

A Pen by Andy Galletly

A Pen by julian