Search the Community
Showing results for tags 'symbols'.
Found 2 results
-
Hello, I want to start by saying i'm a noob to programming in general, as to javascript and green sock. As soon as I learned some html and css I dived into SVGs. I have an illustration background so this seamed appealing and most fun to me... I quickly realised that greensock is the way to go... So, I want to animate my logo appearing in a sci-fi kind of way, where there is a bunch of stuff happening. This isn't the logo animation but a test. I want to learn what I can and can't do... I am trying to use a single svg and make it appear a bunch of times using the staggerfrom. The plan was to create a symbol and then call on it as many times as I need. Then make them stagger on to the screen. The problem is I dont know how to call on those symbols with Tween... I tried giving my <use>es Ids, classes and even putting every <use> element inside of a div. The first two just don't make the animation work. When I put it inside of a div then the animation works but the called <use> symbols are just not visible. Am I doing something wrong or is it not possible? Is there a workaround? I know there must be but my general knowledge is limited at best. romb.svg
-
Hi, guys! I'd like to share with you a feature that I made for my site recently: http://codepen.io/nordskill/pen/qqMMrL It is an animated progress bar that visualizes the amount of symbols you've entered. The script automatically shows the bar for all the fields that contain maxlength attribute. Just an example of usage:
