Lightweight slider/carousel added

Reading time: 1 minute

A lot of websites have a slider (or carousel). Most of them in the header. The big question is: Should I add a carousel to my Hugo website? This is something I cannot decide for you. If you decide you need one, I added a decent one under Add ons > Slider/carousel in the main menu. A demo is shown below:

The carousel is based on a carousel with CSS scroll snap that I created earlier. On desktop you can interact with the arrows and the bullets, on mobile you can swipe. This carousel supports native lazy loading and will ‘pause’ on hover. It even kinda works without Javascript. This carousel weighs only 3kb (uncompressed). This is 50 times less than the 150kb JS file you need to load for something like SwiperJS (which has awesome features by the way).

Joost van der Schee

Share on: