Skip to content

anasak-dev/slider-interaction-threejs

Repository files navigation

Slider Interaction with Three JS

portrait-three-slider

This is a slider interaction which is inspired from this website https://evervault.com/use-cases/file-encryption.

Installation

Clone this project and install it using npm

npm install

Then run it in browser via below command

npm run dev

Code Structure

All scripts other then app.js are available in utils Folder
-----------------------------------------
Random character generator script is located under utils/random_characters
----------------------------------------------------------------------------------
Three JS specific script is located under utils/three_canvas
-------------------------------------------------------------
Slider specific script utils/slider.js

Tech Stack

Vite, TailwindCSS, Three JS, JS

Important Note

This is not mobile optimised for now and will be on roadmap for other release.

Contributing

Pull requests are welcome. For major changes, please open an issue first to discuss what you would like to change.

🔗 Personal Links

portfolio linkedin twitter