Let visitors push the project gallery about themselves - #7
Merged
Merged
Conversation
The gallery on the landing page moved on rails: `UMarquee` animates its content in CSS, and a CSS animation is not a scroll position, so a trackpad swipe, a touch drag or a mouse drag had nothing to take hold of. Anyone wanting a second look at a card that had just gone past had to wait for it to come round again. `DraggableMarquee` lays the same repeated content out in a real horizontal scroller and drifts it by nudging `scrollLeft` a fraction of a pixel each frame, which makes the drift one more writer of a position the visitor can write to as well. Scrolling, swiping, dragging, momentum and the keyboard then all work because the browser already does them. It stands aside while it is being used: the drift stops under the pointer, during a drag, while a card holds focus, for a moment after any scrolling of the visitor's own, off screen, and entirely for anyone who asks for reduced motion. A drag that ends over a card is not taken for a visit to it, and the duplicated copies are hidden from screen readers and taken out of the tab order without being made inert, which would have stopped the clicks as well. Co-Authored-By: Claude Opus 5 <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_015aCGjKwtBpk8NdVKxQiCRA
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
This branch was successfully deployed
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
2 participants
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
The gallery on the landing page moved on rails:
UMarqueeanimates itscontent in CSS, and a CSS animation is not a scroll position, so a
trackpad swipe, a touch drag or a mouse drag had nothing to take hold
of. Anyone wanting a second look at a card that had just gone past had
to wait for it to come round again.
DraggableMarqueelays the same repeated content out in a realhorizontal scroller and drifts it by nudging
scrollLefta fraction ofa pixel each frame, which makes the drift one more writer of a position
the visitor can write to as well. Scrolling, swiping, dragging, momentum
and the keyboard then all work because the browser already does them.
It stands aside while it is being used: the drift stops under the
pointer, during a drag, while a card holds focus, for a moment after any
scrolling of the visitor's own, off screen, and entirely for anyone who
asks for reduced motion. A drag that ends over a card is not taken for a
visit to it, and the duplicated copies are hidden from screen readers
and taken out of the tab order without being made inert, which would
have stopped the clicks as well.
Co-Authored-By: Claude Opus 5 noreply@anthropic.com
Claude-Session: https://claude.ai/code/session_015aCGjKwtBpk8NdVKxQiCRA