This repository contains a Flipkart lookalike product slider developed by Alok Singh. The slider provides a user-friendly and customizable way to showcase products in a slider format.
Visit the code: click me
Slider example live preview: click me
-
Smooth Transitions: Elevate user interaction with a polished, smooth transition between card slides for a delightful user experience.
-
Reusability with CDN: Easily integrate the slider into any project by leveraging its reusable nature, facilitated through convenient CDN links.
-
Smart Navigation: Enjoy a clutter-free interface as the slider intelligently conceals navigation buttons at its edges, ensuring a sleek and intuitive design.
<script defer src="https://cdn.jsdelivr.net/gh/alok-sci/[email protected]/flipkart-product-slider/slider-small--btn-hide/script.js"></script>
<link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/gh/alok-sci/[email protected]/flipkart-product-slider/slider-small--btn-hide/style.css"><script defer src="https://cdn.jsdelivr.net/gh/alok-sci/[email protected]/flipkart/small/script.js"></script>
<link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/gh/alok-sci/[email protected]/flipkart/small/style.css"><div class="fk-slider">
<div class="fk-cards">
<div class="fk-card-wrapper">
<div class="fk-card">
<div class="fk-img-wrapper">
<img src="path/to/img.png">
</div>
<div class="fk-content-wrapper">
<span class="fk-title">Title of the Product</span>
<span class="fk-price">Price of the Product</span>
</div>
</div>
</div>
</div>
</div>Issues and pull requests are welcome! Feel free to contribute to the development of this slider.
If you find this project helpful and would like to support the developer, consider buying a coffee:
Click the images above to redirect to the Buy Me a Coffee ☕ page.
This project is copyright protected, but it's free to use and contributions are welcomed. © 2024 Alok Singh.