Jump to content

Victor Work

  • Posts

  • Joined

  • Last visited

Everything posted by Victor Work

  1. Hello @harp, I do not quite understand if this is your problem regarding scaling, but I chose to make an example using .fromTo that can help you.
  2. I'm using the translator and maybe this conversion is messing up in my mind, let's see if I can explain it in more detail. Let's take into consideration the site: https://www.videinfra.com/ when you do a MouseDown on the screen it activates a draggable element that runs all over the screen, this draggable has a sniap that stops at a certain point, gives the trigger to an animation. I would like to achieve the same effect, the scale part applies more to benmingo site that does the same dynamics above, but with scale in the elements of the page, the problem is being manipulate the snap, could I explain better?
  3. I'm going to study a little bit about this method, although I do not have any in-depth knowledge of some of the features that you used in your example, and let's combine that basic and equivalent to the advanced one for many people, especially my hahahha. One question, I always see you creating this proxy element in Draggable, why is this created?
  4. in fact I would like to create a Slide with Snap using Draggable that onPress give a scale in the content so that I can make the transition in the mouse moves. Sorry if it was difficult to understand. But I'm not getting it, so I wonder if there is a way to do this with Draggable
  5. Hello guys I am trying to make a draggable slide like these: https://www.videinfra.com/ (Page Home) http://www.benmingo.com/ (Page Home) https://bullyingandbehavior.com/ (Page Home) I tried to do with Scale in the Holder but it did not work very well, the closest I got was changing the vw of the holder. But now I do not know what I can do: does anyone help?
  6. Taking advantage of the topic I remembered from this example here, which is a bit more complete: http://www.espn.com/espn/feature/story/_/id/19742921/espn-body-issue-2017#!athletes_uswomensnationalhockeyteam
  7. Hello, this kind of transition between pages goes a bit beyond the resources that GSAP provides. Looking at the source code of the site you mentioned, it is worth noting that it is using a framework based on SPA (Single Page Application), to get this done you can search on some of these frameworks, these are the most used: - VueJs - ReactJS - AngularJs. After achieving this you can create Tweens that animate before and leave the page and animate when you enter and you will have this same transition effect.
  8. Thanks @PointC, Exactly this, there is a way for me to assign a duration time to this animation?
  9. Hi Gsap'ers. Is there a way to go to a label other than just jumping? Example: When clicking the button it goes from the current point of the timeline to the label, but keeping the tweens in sequence.
  10. I saw your question and by the way is the same concept of a project that was creating, using really the methods that @OSUblake mentioned. There are some adjustments to be fixed, but if you have not gotten the result, it can help you. Ps .: I used a demo video of ShutterStock because of the fluids, but you can do with images in a spriteAnimation:
  11. I am happy with the mention, but the merits are yours. And I'm happiest to receive a compliment from this coming from a person who handles a lot. Thank you
  12. Woow the pen used was highlighted in Codepen;)
  13. Wow Blake, I really appreciate how helpful you are in helping the participants in the forums, I really do leave to ask you here after you have researched a lot and have not found any solutions and it is of extreme importance these supports that you give, I will make an outburst here if you have someone who indentify, I started to venture into web development about a year ago and I decided to do it myself, I never worked in an agency or any other place that had someone to give a direction on front end development. I was learning alone as the need arose and I wanted to make my projects more interactive. And thanks to you I see that my development improves every day. Sometimes it seems kind of lazy to come here to ask you something that is simple and obvious to you. But for those who are starting it is a super challenge and every detail that you show in the code of support that you make of a horizon for those who are in search of new knowledge. Something that maybe alone would never be able to achieve. Thank you sincerely on behalf of all these helps that you give us, it is very Important! Thank you.. @OSUblake @Sahil and the other moderates.
  14. Wow it was very good, congratulations. I will study every part there to be able to implement in my Projects. Thanks again, you are the guy <3
  15. Thanks Sahil, sure already helped enough, you could explain or point a place that talks a little about this property: _gsTransform.x I found it very interesting but I do not know how it works kkkk Thanks again for the help!
  16. Hello, I'm having trouble synchronizing a progress bar with Draggable, I tried doing this simulating a Click event with Jquery, but it did not work well, I think the way improvement is using (Progress) but I did not identify which draggable function I I attribute this. Someone with a light?
  17. Hello Gsaper's, I'm trying to make a menu with images, which to the click directs to the center of the screen, and fills the screen completely, when it is clicked again the element returns to its initial state, but I need to do this using css flexbox. After many attempts I got to this stage.
  18. ScrollMagic's TriggerHook system is used to indicate from how many percent what element is in the Viewport it will start the animation. Example TriggerHook: 0.8 (The element will start animating when it is 20% of the bottom of the viewport) Since TriggerHook: 1 is equal to 100% of Viewport. Did you get it?
  19. Hello Blake, sorry for the delay, I've been working a lot these days. First of all I want to thank you for having made some of your time available to create this, it is very useful for me. And I'm sure I'll use it on many projects. Just a question, is there a way for Parallax to start as soon as the element enters the viewport? For here he is cheering when he comes in half. A solution similar to ScrollMagic's TriggerHook. Cheers
  20. After much searching on the internet, and not finding the solution, because the document.referrer method does not work for the VueJs route system, I ended up buying a course at Udemy that explains how to manipulate data before entering the route, so I found a solution , I used the .trigger () event of jQuery and inserted it into the function that is executed before entering the route. The result is in the Snippet below. Stay there for someone if you are interested: beforeRouteEnter (to, from, next) { if (from.name === 'NameOfComponent'){ next(vm => { $( ".box" ).trigger( "click" ); console.log('Veio do Vuetif') }); } else { next(); } } Thx @Sahil Again.
  21. I'll try, and when I can, I'll tell you which method was used. Thx @Sahil
  22. I have never used .seek (), but according to your message I believe this is possible, do you have any idea how I can do to find out if the page input came via an internal navigation? A function maybe?
  23. Hello GSAPers, I did a project here using DrawnSVGPlugin, SplitText, ScrollTo and a few others, and found a challenge: The challenge is the dynamics of the Casting link. I'm targeting, some Timelines that are triggered with click events on the bookmarks next to the photo. Each indicator is linked to a Timeline, however all this content is only in one component (Home.vue); Example: Upon entering the Component it triggers the Timeline of Intro, which pulls a button that to the clicked triggers the Casting Timeline, there is the question: Which way when I click on the casting button does it already enter by jumping the timeline of the intro and automatically firing the Casting Timeline? I believe the best way would be a check to know if entering the component it is coming from an internal route or an external link, but I do not have the slightest idea how to do it. Thank you very much in advance. The project is in this link (provisional) http://marcelocalcados.com.br/