question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Make tour start transition animation from specific point of the screen

See original GitHub issue

I’m looking the way to tweak tour appearing behavior.

What I see now:

When tour appears for first time, it always starts from left top corner of the screen and with some transition animation move to the position of the first step. If I close in on N step and open it again, it moves from the position of N step to position of 1 step (thanks to startAt={0} prop).

What I want:

I need transition animation to start from specific point of the screen. In my case it’s the icon to enable tour mode.

I see state vars responsible for positioning, but if I change them on componentDidMount to some other values this.tourRef.current.setState({ top: 500, left: 500 }); it still appears in the top left corner instead of my desired 500x500 point.

What am I missing? Is there another way to achieve what I want?

Issue Analytics

  • State:open
  • Created 4 years ago
  • Reactions:8
  • Comments:8 (3 by maintainers)

github_iconTop GitHub Comments

2reactions
elrumordelaluzcommented, Oct 2, 2019

Hi @ramusus, thanks for open the Issue. Interesting, let me dig deep in to it and back to you asap.

0reactions
elrumordelaluzcommented, Oct 25, 2021

@emma-adams-machine can you pleae share a minimal reproduction sandbox?

Read more comments on GitHub >

github_iconTop Results From Across the Web

Start an activity using an animation - Android Developers
To make a screen transition animation between two activities that have a shared element, do the following: Enable window content transitions in your...
Read more >
Video: Animations and transitions - Microsoft Support
Some animations have Effect Options that add direction to animation. Select Slide Show button The Begin Slide Show button. to view the animation....
Read more >
Animate objects onto and off a slide in Keynote on Mac
To make your presentation more dynamic, you can animate the text and ... slide one bullet point at a time, or make an...
Read more >
PowerPoint Animation Tutorial - Learn How To Animate
By the end, you'll know all the essentials of animating in PowerPoint. Additional resources: - Create your own 3D objects using Paint 3D: ......
Read more >
Zoom In to Focus Attention | Camtasia - TechSmith
Zoom-n-Pan · To position when the animation occurs, drag the arrow. Drag arrow to move animation on timeline · To change the animation...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found