A smooth, responsive, and infinite slider component built using Svelte, Vite, and TypeScript. The slider animates images in a loop and allows users to control the animation speed by hovering over the slider.
- Seamless animation with adjustable speed on hover
- Responsive design
- Built with Svelte, Vite, and TypeScript for a modern development experience
- Highly customizable and easy to integrate into your projects
-
Clone the repository: git clone https://github.com/miliansolberg/svelte-slider.git
-
Install dependencies: cd svelte-slider pnpm create vite --> Choose Svelte with Typescript.
-
Run the development server: pnpm run dev --> Use your preferred localhost port.
-
Open your browser and navigate to
http://localhost:3000, or your preferred localhost port :)
To use the Infinite Slider in your project, simply copy the Slider.svelte component and its corresponding TypeScript and CSS files. Import the Slider.svelte component into your Svelte application and customize the content and styling as needed.
You can customize the appearance of the slider by updating the CSS styles in the Slider.svelte file. Additionally, you can modify the animation duration and speed by updating the animationOptions object in the TypeScript code.
I welcome contributions to the Infinite Slider project! Please feel free to open issues or submit pull requests with any improvements or bug fixes.
This project is licensed under the MIT License. See the LICENSE file for more information.