در اینجا چند تا از بهترین اسلایدرهای جاوااسکریپتی (Image/Content Slider/Carousel) رو معرفی میکنم که هم قدرتمند، هم سبک و هم قابل تنظیم هستن — برای پروژههای ساده تا حرفهای:
اگر هنوز زبان javascript یاد نگرفتی الان میتونی شروع کنی.
۱. Swiper.js
- کاملاً ماژولار و قابل شخصیسازی
- کاملاً ریسپانسیو و لمسی (Touch Support)
- پشتیبانی از loop، autoplay، pagination، navigation و …
- نسخه بدون وابستگی (
vanilla JS
) و نسخه React/Vue/Angular
لینک: https://swiperjs.com
نصب سریع:
npm install swiper
۲. Glide.js
- بسیار سبک (~23KB)
- پشتیبانی از slider و carousel
- بدون وابستگی به jQuery
- مناسب برای اسلایدرهای ساده و سریع
لینک: https://glidejs.com
نصب سریع:
npm install @glidejs/glide
۳. Splide.js
- مناسب برای گالری تصاویر
- پشتیبانی از thumbnail navigation و multiple slides
- بدون وابستگی، سبک و سریع
- پشتیبانی از SSR و پلاگینها
لینک: https://splidejs.com
نصب سریع:
npm install @splidejs/splide
۴. Flickity
- طراحیشده برای UI مینیمال و موبایلپسند
- پشتیبانی از dragging، pagination، lazy load و …
لینک: https://flickity.metafizzy.co
کدومش بهتره؟
ابزار | مناسب برای | مزایا | معایب |
---|---|---|---|
Swiper.js | همهچی از ساده تا حرفهای | حرفهای، مستندات قوی، تاچ عالی | کمی سنگینتر |
Glide.js | پروژههای ساده | سبک و سریع | امکانات کمتر |
Splide.js | گالریهای حرفهای | تمیز، ماژولار، SSR-friendly | کمتر شناختهشده |
Flickity | سایتهای مینیمال | ساده و شیک | توسعه کندتر |