menu

Framer

Express your creative ideas through interactive design. Join the community for updates, support, resources, and more.

Channels
Chat
view-forward
# All channels
view-forward
# General
view-forward
# Announcements
view-forward
# Bug Reports
view-forward
# Feature Requests
view-forward
# Learn
view-forward
# Meetups
view-forward
# Resources
view-forward
# Snippets & Tips
view-forward
Team
Posts
Members
Info

Build a Checkbox

In this tutorial, we’ll be creating a Checkbox. We’ll learn about using Design Components inside of our Code Component, how to respond to interactions within the component, and how to respond to those events from elsewhere in our project, too. 🔗 Build a Checkbox Check out the…

thumbsup
4
message-simple
5

Is it possible to have nested children working with AnimatePresence ?

I am trying to use AnimatePresence in Menu example: https://codesandbox.io/s/framer-motion-side-menu-erz68 Is there a way to animate whole tree on exit or only top children ?

thumbsup
2
message-simple
1

Create Custom Page Effects

In this course you’ll learn how to create custom page effects with less than 50 lines of code. With custom page effects, you have full control over what visual properties change as you swipe between a set of pages, allowing you to create playful gestures with infinite…

thumbsup
2
message-simple
13

whileHover transitions seem to be broken except for hover state

I can control the duration of my hover variants, but anything on the other state is ignored. Is this a bug, or am I missing something? You can see my hover duration is nice and smooth, but when you hover off it seems to default to spring animation. Even though I set the other…

thumbsup
1
message-simple
1

How to use layoutTransition on draggable elements?

I want to use a layoutTransition animation to expand elements to fullscreen. I've done this several times using react-pose and now framer-motion. My issue is that the elements that I want to animate can be moved ( they are draggable cards I'm using React Beautiful DND) Therefore…

thumbsup
1
message-simple
0

Fixed menu bar when using overlays/pushed frames?

This is probably quite simple but I can't figure it out. I'd like a fixed menu bar so when the "open menu" icon is tapped, the bar stays where it is, and the linked frame (the actual menu) slides in underneath the menu bar. Any ideas?? …

thumbsup
0
message-simple
0

Help! If / else based on scrolling

This is driving me nuts because it seems like it would be simple, but I can't figure out how to accomplish this. I'm using a series of Frames (not scrolls, for various reasons) within a Page component, and I'd like to create following logic: If (vertical scrolling occurs on the…

thumbsup
2
message-simple
0

Is there an alternative Package to Scroll Away?

Scroll Away: https://packages.framer.com/package/derlukas/scroll-away I've installed the package but the overrides do not display so the package is useless. I'm using Framer Library 1.1.5. Can anyone help with an alternative package/ solution?

thumbsup
0
message-simple
6

Using fonts in code

Hi there, The Font Files package from the store works! However, I now would like to try to add fonts in code. I followed these instructions (under 'using fonts in code'): https://www.framer.com/support/using-framer-x/working-with-fonts/. I tried to do this in multiple ways, but…

thumbsup
2
message-simple
9

Rendering animating values directly to the view as text

I've combed the framer-motion docs but I can't quite sort out how to achieve accessing animating values directly. The common use case for this would be rendering a number that is changing from one value to another. With React Spring (example on this page), that looks…

thumbsup
1
message-simple
1