Search the Community
Showing results for tags 'border'.
Hello, i have 1 element. He must grow in width, height and border, and he do this. But have problem after when i did reverse (i showed two case) 1-case(icon-cursor-1): When click start and after complete animation click reverse() (after complete animation reverse) and again click start we see: border width jumping 2-case(icon-cursor-2): When click start and after complete animation click reverse() (after complete animation reverse) , he don't return primary value for border width (default border width 3px) P.S. if i write position 0(=0.75) for tweens, he return true value. Please help understand what i doing wrong, and how this work ? Sorry for my English =)
Hello friends of gsap! This is my first post here but i suspect i will return since gsap is awsome! I'm trying to make a rotating circle with arrows pointing at each word. Here is an image that shows what I'm trying to do. http://boxesandarrows.com/files/banda/prototyping-with/iterative_prototyping-small.gif How can i achieve this? I tried using css border and images but I don't know how to apply it the correct way so the arrows rotate with the boxes as seen in the codepen. I want the arrows to basically point on each box. Thank you for your time and keep up the good work!
Hey again Greensock guys , I've got a brainteaser for y'all, hopefully it's an easy one. I did do a search around before asking, but the forum search won't include the word 'border' as a keyword, it's restricted, and Google only answered so much of what I needed to know. Okay, so I'm trying to recreate this pen from CSS to JS (GSAP): http://codepen.io/joelrodelo/pen/uHjvi Assumed it would be simple enough but it's proving trickier than I thought. I've been trying to do it with an image on a page, have a quick sample here for reference (you can thank me for the working image later ) : http://webslinger.com.au/dev/gs_border_animation/index.html Some of my attempts or JS fiddles are still in the scripts.js page, just commented out, but they're there for reference. I've just been starting with the left side of the image to begin with. The problem I run in to is that the border appears from the outside in, and any method I've tried to have the border appear from any other direction - either by 'y:' or 'height:' - has failed, moved the entire image with it, or nothing's happened at all (you can see some of my other attempts in the js file). I figured the most logical thing to do would be to nest it, to create a new Tween variable that adds the className and then animate the variable in a new TweenMax line, but I think I've gone wrong somewhere with that approach (read back through the documentation, can we only nest new Timeline's, not new TweenMax's?). Anyway, maybe someone's already figured out an approach to this and I've missed it, or maybe the solution's just too obvious for me to see, cause' surely it wouldn't come to having to actually draw a border line around the image would it? Appreciate any feedback in advance.