SVG Draw Widget
The first SVG Draw Widget for Adobe Muse! This widget allows you to animate your SVG images by drawing them in real-time.
- Draw multiple SVG images
- Change the stroke color of the SVG image within the widget
- Set the duration of the SVG drawing
- Add easing to the SVG draw
3 Drawing Options:
- One by One
- On Load
- On Scroll
- With Play Buttons
SVG Draw Widget - 1.2 - 9-19-2016:
- New widget interface.
- New widget setup.
- New ‘On Scroll’ setup.
- Ability to change the stroke color of the SVG image within the widget.
- Ability to see the SVG image while working with it in design mode.
- Ability to repeat the SVG draw on scroll.
- Ability to add a play, pause, and restart button for the ‘On Load’ widget.
- Fixed the ‘Path Timing Function’ option.
- Instructions included within the widget for easy reference on how to use the widget.
- Updated Code.
SVG Draw Widget - 1.3 - 10-3-2016:
- SVG images can now have a fill color.
- SVG images do not need to be edited in Adobe Illustrator before adding them to the widget.
- Ability to set the stroke width within the widget.
- Ability to add fill after draw.
- Ability to set fill color after draw.
- Ability to set fill fade in speed.
- Ability to add a delay before the SVG draws.
- Ability to redraw SVG on click.
- Ability to redraw SVG on hover.
- Ability to fade out SVG after it draws.
- On Scroll widgets have been removed. You can set the start option to ‘In Viewport’ to have the SVG draw once it is visible in the browser.
- Fixed issue with SVG images not drawing in Internet Explorer.
SVG Draw Widget - 1.4 - 10-24-2016:
- Fixed issue with SVG not filling in Internet Explorer and Microsoft Edge.
- Fixed issue with SVG scaling to a smaller size in Internet Explorer.
- Ability to use the original stroke of the SVG by disabling the ‘Stroke Color’ option.
- Ability to fade out the stroke of the SVG after it finishes drawing.
- Updated Code.
Simply add the widget to your Adobe Muse website, add SVG image, customize with widget options, and done!