{"id":151,"date":"2015-12-06T13:22:58","date_gmt":"2015-12-06T07:52:58","guid":{"rendered":"http:\/\/blog.azoora.com\/?p=151"},"modified":"2020-09-16T08:52:20","modified_gmt":"2020-09-16T08:52:20","slug":"elastic-svg-progress-loading-bar","status":"publish","type":"post","link":"https:\/\/azoora.com\/blog\/code\/elastic-svg-progress-loading-bar\/","title":{"rendered":"Elastic SVG Progress Loading Bar"},"content":{"rendered":"\n<p>Codrops has published a tutorial of how to create an <a rel=\"noreferrer noopener\" href=\"http:\/\/tympanus.net\/codrops\/2015\/09\/23\/elastic-progress\/\" target=\"_blank\">elastic SVG progress loader<\/a> based on the Dribbble shot \u201cDownload\u201d by xjw and implemented with SVG and TweenMax. The button starts as an icon with an arrow and once it\u2019s clicked, it animates into a fun little wire and a label that indicates the download percentage. If you would like to use this loader in your project, go to the <strong>GitHub<\/strong> page and follow the instructions.<\/p>\n\n\n\n<!--more-->\n\n\n\n<blockquote class=\"wp-block-quote\"><p><strong>Requirements<\/strong>: \u2013<\/p><p><strong>Demo<\/strong>: <a href=\"http:\/\/tympanus.net\/Development\/ElasticProgress\/\">Link<\/a><\/p><p><strong>License<\/strong>: License Free<\/p><\/blockquote>\n\n\n\n<p><\/p>\n","protected":false},"excerpt":{"rendered":"<p>Codrops has published a tutorial of how to create an elastic SVG progress loader based on the Dribbble shot \u201cDownload\u201d by xjw and implemented with SVG and TweenMax. The button starts as an icon with an arrow and once it\u2019s clicked, it animates into a fun little wire and a label that indicates the download [&hellip;]<\/p>\n","protected":false},"author":2,"featured_media":152,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"spay_email":"","jetpack_publicize_message":"","jetpack_is_tweetstorm":false},"categories":[4,145,8],"tags":[93,96,101,16,18],"jetpack_featured_media_url":"https:\/\/azoora.com\/blog\/wp-content\/uploads\/2015\/12\/dribbble.gif","jetpack_publicize_connections":[],"jetpack_shortlink":"https:\/\/wp.me\/p7FQPL-2r","jetpack-related-posts":[],"jetpack_sharing_enabled":true,"jetpack_likes_enabled":true,"_links":{"self":[{"href":"https:\/\/azoora.com\/blog\/wp-json\/wp\/v2\/posts\/151"}],"collection":[{"href":"https:\/\/azoora.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/azoora.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/azoora.com\/blog\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/azoora.com\/blog\/wp-json\/wp\/v2\/comments?post=151"}],"version-history":[{"count":3,"href":"https:\/\/azoora.com\/blog\/wp-json\/wp\/v2\/posts\/151\/revisions"}],"predecessor-version":[{"id":5519,"href":"https:\/\/azoora.com\/blog\/wp-json\/wp\/v2\/posts\/151\/revisions\/5519"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/azoora.com\/blog\/wp-json\/wp\/v2\/media\/152"}],"wp:attachment":[{"href":"https:\/\/azoora.com\/blog\/wp-json\/wp\/v2\/media?parent=151"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/azoora.com\/blog\/wp-json\/wp\/v2\/categories?post=151"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/azoora.com\/blog\/wp-json\/wp\/v2\/tags?post=151"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}