Patryk D&D last won the day on December 25 2015

Patryk D&D had the most liked content!

Patryk D&D

ShockinglyGreen
  • Content count

    19
  • Joined

  • Last visited

  • Days Won

    2

Patryk D&D last won the day on December 25 2015

Patryk D&D had the most liked content!

Community Reputation

14 Newbie

About Patryk D&D

  • Rank
    Front-end animation lover
  • Birthday 09/15/1990

Contact Methods

Profile Information

  • Gender
    Male
  • Location
    Gdynia
  1. Eh, god, so I solved this by just scaling down the child elements instead of scaling down the whole group. https://codepen.io/Dikus/pen/JNdPrM Anyway I'm curious, why it scales down the motion path while scaling down the group ? If anyone will bump into this, just scale down the child elements using the svgOrigin of the element you would like to scale down. Nice tool for quick checking the svg Origin - https://gist.github.com/brunnolou/cab8c0a481ea78ff50dc works like a charm ! just paste the code into the console and enter the class/id in the prompt
  2. Hello everyone ! I have some very fun and complex thing to do, and any help will be much appreciated ! I'm trying to move SVG group along the path, scale it down, and then move elements of that group along different path. But when I scale down the parent element I also scale the motion path of the child element, and I'm wondering what I'm doing wrong here? Or, maybe my approach is just totally bad. That is what I have https://codepen.io/Dikus/pen/EmaqbV And that is what I would like to achieve - of course the group should scale down, but the path should be the same https://codepen.io/Dikus/pen/EmaqLP?editors=1010 Final SVG - maybe this will help you to imagine what I would love to achieve - the last movement of the purple particle, should move along the purple stroke http://patryksmakosz.com/dev/spectrometer/ So, my question is - is it possible to scale down the main element, and do not scale the path with it? Wish you all the best ! PS pathDataToBezier just rocks! Probably I miss something big here
  3. Thanks a milion ! Nice eyeball work ;D Great demo, that's very close to my planed result, thank you for the tip about the SVG, and once again for the overall help. I'm going back to dig up some more info about the svgs, and to their core itself - https://sarasoueidan.com/blog/svg-coordinate-systems/ - thought I know quite a lot about them - I wasn't prepared
  4. Eh I feel so stupid! Thanks, I had that design from sketch and it was a bit messy process, I forgot to ask, how you calculated the exact svgOrigin points? Looks like that's what I did wrong there...
  5. Yup, the blog is just awesome ! I need to catch up with all the posts there I have one more issue that changes everything - the orbits aren't perfect circles (damn you reality) This even wouldn't be visible - but the orange circle exposes that clearly http://codepen.io/Dikus/pen/BWNdzo If you can Jack, please expand a bit - what technique/s would you suggest? Of course any help will be much appreciated ! Thanks
  6. Thanks! That's exactly what I needed, svgOrigin, love it ! That article looks very nice too, haven't read that yet. I had tried that approach earlier Jack, and I was shocked why it didn't worked, and where the other planet went...it worked just fine, the other planet was stacked on top of the other one... ^_^' http://codepen.io/Dikus/pen/VpwdNx?editors=1010 Again thanks ! I should be able to handle that now !
  7. Hey I have small issue with figuring out how to use the pathDataToBezier plugin, I've read a lot of similar topics, and probably I could do this with just some pure js or even pure css. But I wonder is there some simple way to animate few objects on the same path? I used some very simple example - right now, only the red 'planet' sticks to it's orbit, but it also ends in the different point it should - this should be just perfect closed orbit for all objects on it. I'm probably missing something very basic here Any suggestion on how to bite this would be a huge help ! There will be a lot of objects on that orbits, and I would love to have a lot of control there. http://codepen.io/Dikus/pen/VpwdNx?editors=1010 Thanks!
  8. Thank you very much !
  9. Thanks Jonathan and PointC! With your help I was able to make something close to the desired effect, tho I think ScrollMagic isn't the right library for that I tried your suggestion Craig, but I already have so much elements on the site that I had to gave up - my DOM is dynamic and loads after certain scroll position, I would have to plan this better earlier - but nice cheat Anyway, GSAP is the solution ! I just need to make my sections with specific height and capture the scroll event on each element - it's not the perfect way and it's not possible to scroll through the site like I wanted, but it's close ;p Anyway it's a fast way of creating kinda "one scroll section navigation" - and the sections don't have to be 100% so maybe someone will find this useful. http://codepen.io/Dikus/pen/dXxBkA Thanks once more! Happy everything P.S By the way, it it possible to use scrollTo with something like this : TweenLite.to(window, 1, { scrollTo: '+=526' }); To scroll let's say 526px from the current position? I tried to use it but it does not work ;p It does not show any error either
  10. Hello ! Sooo, I'm trying to play a little with ScrollTo plugin and ScrollMagic.js my goal is to achieve smooth scroll to the bottom of the footer (that works) http://codepen.io/Dikus/pen/jAjoqN and then (after the user scrolls once up on the footer element) go back to the view where top of the footer is right at the bottom of the viewport. Problems I encountered: Scrolling works only once and only in one direction - usually ScrollMagic reverses all animations etc.so after scrolling back up from the bottom of the footer It would be lovely to achieve smooth scrolling in both sides and always when user is navigating through the website - not only once I bet it's possible, and that I do something terribly stupid Can you guys please help and give me some hits how to work this out? Maybe it's not possible to do this with ScrollTo and ScrollMagic but they are not a must. Any help will be more than welcome !
  11. Thanks Jonathan ! I did use your code with newest CDN (I pasted it into my parent theme (Avada) functions.php) and it didn't lunch, but probably I messed up something if it works for you Anyway again thanks for double checking this Still maybe someone will find this helpful for local TweenMax in their WordPress theme Have a great day !
  12. Hi, sorry if that's necro posting, but mentioned above method is not working anymore (?) or I messed up something. Anyway, this should work, it did job for me function enqueue_TweenMax() { if ( ! is_admin() ) { $scriptsrc = get_template_directory_uri() . '/assets/js/TweenMax.min.js'; wp_register_script( 'TweenMax', $scriptsrc ); wp_enqueue_script( 'TweenMax' ); } } add_action( 'wp_enqueue_scripts', 'enqueue_TweenMax' ); Hope this can help someone
  13. Thank you guys for interest I'll definitely look more deeply into this. With such great intel I'll probably handle the rest P.S Sorry I respond with such a delay - mail with info about new post in topic arrived after OSUblake post Have a wonderful day !
  14. Hi, I love those snippets, and I use sublime strictly for them but maybe there is a way to implement them into Brackets?
  15. I had dozens of questions and I had found hundreds of good answers here. First time I'm actually feeling comfortable on forum, everyone just try to help each other - maybe someday I will be able to help others to Thanks to your help I did my first morph that I'm almost proud of http://codepen.io/Dikus/pen/jWrdZO It's a bit clunky because I had to multiply few elements and use them twice - I bet there's a way to make it smooth, I just need to take a peek on few more demos after a solid nap ;p