@Slidy

Simple, configurable, nested & reusable sliding action script with templates, animations, easings & plugins.

Сompletely mimics the behavior of a native scroll with mouse drag, index navigation, acceleration, gravity & infinite loop mode.

{ snap: 'deck', animation: flip }

Try the version 3 DEMO

Packages

• @slidy/core - Core sliding script
• @slidy/media - Observable media
• @slidy/easing - Easing functions
• @slidy/animation - Animation functions
• @slidy/svelte - SvelteJS template
• @slidy/solid - SolidJS template

👨🏻‍💻 in progress...

• Demo docs site based on SvelteKit

📝 todo...

• @slidy/react - ReactJS template
• @slidy/vue - VueJS template
• @slidy/wc - WebComponent template
• @slidy/malina - MalinaJS template

NPM organization @slidy

Development

• pnpm workspaces - monorepo
• esbuild - bundling & packaging
• derver - dev server

Thanks 🎉

@ariya for kinetic - examples & explanations of scroll kinetic principles
@argyleink for open-props - Open Source CSS Variables
@evanw for esbuild - an extremely fast JS bundler
@rodshtein for the idea of implementing the action function
@EricRovell for collaboration & ideas of modulating @slidy
@yhdgms1 for collaboration & SolidJS implementation
@AlexxNB for esbuild starter based on derver - simple but powerfull dev/prod nodejs server
@PaulMaly for idea of simplifing reactive updates of options object

MIT © Valexr