Create A Responsive Card Slider in HTML CSS & JavaScript | Step-by-Step Tutorial
CodingNepal
0:00 / 0:00
Create A Responsive Card Slider in HTML CSS & JavaScript | Step-by-Step Tutorial
23 178 просмотров · 1 год назад
CodingNepal
251 тыс. подписчиков
23 178 просмотров · 1 год назад
In the video, I showed how to make a responsive card slider using HTML, CSS, and JavaScript. The slider lets users navigate through cards using buttons or pagination bullets. Built with SwiperJS, a powerful slider library, it offers a modern design, smooth touch interactions, full responsiveness, and seamless cross-browser compatibility.
🖼️ Get Only Images of this Card Slider
➤ https://drive.google.com/file/d/1_b7G...
🗂️ Get Source Code of this Card Slider
➤ https://buymeacoffee.com/codingnepal/...
🌐 Visit CodingNepal for free coding projects
➤ https://www.codingnepalweb.com
⭐ Hire me on Fiverr
➤ https://www.fiverr.com/prakashahi
📷 Follow me on Instagram
➤ / coding.np
📲 Follow me on X (Twitter)
➤ https://www.x.com/codingnepal
🕔 Timestamps
0:00 Card Slider Demo
1:52 Starting with HTML & CSS
14:28 Setting up Swiper
15:16 Adding Swiper Layout in HTML
16:26 Initializing Swiper in JavaScript
15:31 Customizing Pagination Bullets
18:21 Card Slider Output
🖼️ Images Source
https://www.freepik.com
🎵 Music Credit
Ikson - Waves [Official]
• #139 Waves (Official)
#html #css #javascript #card #slider #htmlcss #carddesigns #swiper