Jump to content
GreenSock

Diaco last won the day on December 20 2017

Diaco had the most liked content!

Diaco

Moderators
  • Posts

    1,215
  • Joined

  • Last visited

  • Days Won

    86

Everything posted by Diaco

  1. Hi jstafford Pls check this thread : http://greensock.com/forums/topic/12321-non-inline-svg-and-control-with-gsap/
  2. Hi Math pls add this to your css : span{ display:block; }
  3. Diaco

    Draggable cursor

    Hi felixturner pls try like this : .grabbable { cursor: move !important; cursor: grab !important; cursor: -moz-grab !important; cursor: -webkit-grab !important; }
  4. Hi themepunch if i undestood correctly , maybe this thread can help you : http://greensock.com/forums/topic/12445-issue-with-3d-transform-text
  5. Hi azuki yep , you can make text outlines in adobe Ai : - select your text in Ai > right click > Create Outlines . or - select your text in Ai > Type ( from main menu ) > Create Outlines . and export SVG from Ai > save as > *.svg i think that's better to check your svg for issues in this online tool after exporting : https://jakearchibald.github.io/svgomg/ finally you need to set id or class name for your paths to easily select them .
  6. Hi sjerrentrup your problem come from your svg not DrawSVG Plugin , Illustrator have some issues during exporting SVG ( like line breaks in path d / polygon points ) with this online tool you can fix Ai svg issues : https://jakearchibald.github.io/svgomg/ pls check this out : http://codepen.io/MAW/pen/yYgVQv
  7. Hi danrostron Pls check this out : http://codepen.io/MAW/pen/Kdagwj
  8. Hi suicidal.banana if you really need it for css string values , like color,dropShadow...etc , try something like this ( you need last version 1.18.0 ) : function Find(S,E,P){ var X={start:S}; TweenLite.to(X,1,{start:E,ease:Linear.easeNone}).progress(P).kill(); return X.start ; }; console.log( Find('0%','100%',0.5) ); console.log( Find('red','#fff',0.5) ); console.log( Find('0px 0px 10px red','5px 5px 2px #000',0.5) ); otherwise you can use another really simpler function .
  9. Diaco

    Counter

    Hi Pusher if i understood correctly what you're looking for , i think one of these methods can help you : #1 : var distance = {score:0} , zero = [0,0,0,0,0,0,0,0,0,0] , scoreDisplay = document.getElementById("score"); TweenMax.to(distance, 10, {score:"+=1800222123", roundProps:"score", onUpdate:update}); function update(){ var N = distance.score.toString().split(''); if(N.length<zero.length){N.unshift(0)}; function R(x){ return N[x] || zero[x] }; scoreDisplay.innerHTML =R(0)+':'+R(1)+R(2)+R(3)+':'+R(4)+R(5)+R(6)+':'+R(7)+R(8)+R(9); }; #2: var d1=[0,0,0,0] , d2=[1,800,222,123] , scoreDisplay = document.getElementById("score"); d2.roundProps="0,1,2,3"; d2.onUpdate=update; TweenLite.to(d1,10,d2); function update(){ function R(x){ var X = d1[x]<100?d1[x]<10?'00':'0':''; return X+d1[x] }; scoreDisplay.innerHTML = d1[0]+':'+R(1)+':'+R(2)+':'+R(3) ; }; pls check this out : http://codepen.io/MAW/pen/LpbvWO
  10. Hi TomW you just need simple loop ,but since you're using Edge animate Api , pls ask your question in edge community https://forums.adobe.com/community/edge_animate btw you can access to Draggable target by this.target , like this : Draggable.create( elem , { onDragEnd:function(){ console.log( this.target ) } });
  11. Hi kram66 pls make a Codepen Demo available : How to Create a CodePen Demo
  12. Since Draggable use getBoundingClientRect() for top,left/x,y bounds and angel for rotation bounds , it's normal behavior and works as expected .
  13. Hi Friebel pls make a Codepen Demo available for your questions : How to Create a CodePen Demo
  14. Hi jstafford if i understood your question correctly , yep you just need to set once . xPercent:-50 , yPercent:-50
  15. Hi shubhra Svg isn't really good choice for particles effect ( from performance wise ) . so , i've made a demo with svg capsule + divs as particles . pls check this out : http://codepen.io/MAW/pen/ojYzdP
  16. my friend , this is your honor we really have to focus on GSAP api + some times help to start / conception ( not doing projects ) , absolutely it's doable . you just need to define conditions in your check bounds function for those two rectangles too . pls start coding and be sure we will be happy to help you if you have any problem with GSAP api .
  17. Hi hambos22 pls check this out : http://codepen.io/MAW/pen/epBNRj
  18. Hi lucto_et_emergo Carl is right but in addition , if i understood correctly and you'r using edge animate ( regard to your previous questions ) , pls try like this : Draggable.create(mc1,{ type:"scrollLeft" , edgeResistance:0.5 , throwProps:true , snap:function(endValue) { return Math.round(endValue/650)* -650; } });
  19. Hi folktrash pls do like this : var tl = new TimelineLite(); tl.staggerFrom('.box',1,{......},0.1); $("#restart").click(function(){ tl.restart(); })
  20. Hi jcourtice pls provide a Codepen Demo , i think in your case , there should be another easier/alternative way with same result .
  21. Diaco

    Fireworks WIP

    Hi Pusher pls fix line 15# by this : xPercent:-50 , yPercent:-50
  22. Hi waysideco sorry for late reply , i've working on a Demo . in addition to Blake's awesome demo , pls check this out : http://codepen.io/MAW/full/wKWVmG/
×