Right Click Functionality

By right-clicking in certain areas of the interface, you can access context-specific menus that provide relevant options and actions.

Where Can You Use Right Click?

From / To tabs: Right-clicking on these tabs opens up a range of actions that can streamline your animation configuration process:

• Duplicate: Click on the 'From' tab and select Duplicate to replicate the same configuration in the 'To' tab. This is a time-saving feature when you want both 'From' and 'To' tabs to have nearly identical settings.
• Toggle: If you want to switch configurations between 'From' and 'To', simply click on the 'From' tab and select Toggle. This will move the configuration from the 'From' tab to the 'To' tab, and vice versa.
• Clear: To reset the configuration of the 'To' tab, simply right-click on it and select Clear. This action wipes the existing settings, providing a clean slate for you to define new animation parameters for that specific node within the 'To' configuration.
• Copy / Paste: This function allows you to copy the configuration from one tab and paste it onto another. Just right-click on the tab you want to copy from or paste to, and select the appropriate option.

Selector badge: The Selector badge holds the DOM selector and provides a couple of handy options:

• Edit: If you've made a typo or need to modify the selector, simply right-click on the Selector badge and choose Edit. This allows you to directly alter the DOM selector as needed.
• Original state: To restore the selector to its pristine state, stripping away any child combinators (e.g., .selector > *), opt for Original state. This action reverts the selector back to its fundamental format, eliminating all additional parameters and reinstating its initial simplicity and clarity.
• Convert selector: This option allows you to change the selector type to either ID, class, or tag. By right-clicking on the Selector badge and choosing the desired type, you can quickly adjust the selector to suit your needs.
• Add Child combinator: You also have the option to add child combinators to your selector. By choosing + * or > *, you can specify direct children or all descendants, respectively, providing more precise control over your DOM selection.

Individual timeline inside library: The right-click feature provides several options to manage your timelines:

• Duplicate: Generate a clone of an existing timeline to create a very similar one. It is very helpful when you want to make a new timeline that looks similar to an existing one. It helps you keep things consistent while also allowing you to make small changes if necessary.
• Delete: Remove unnecessary timelines to keep your library organized and clutter-free.
• Export: If you need to back up your timeline or migrate it to another site within Motion.page, the Export option is your go-to. This feature allows you to create a portable version of your timeline, ensuring you can restore or replicate it elsewhere as needed.
• Copy UID or database ID: For easy referencing and control, you can copy the Unique Identifier (UID) or the database ID of a timeline. Not only does this allow you to quickly locate or reference a specific timeline, but by using the timeline's UID, you can also target and control the timeline's behavior programmatically, providing a higher level of customization and control.

Remember, the right-click functionality in Motion.page is context-specific, meaning the options you see will change depending on where you right-click. This feature is designed to provide a tailored user experience, making your interactions with the platform more efficient and intuitive.