Skip to main content

Derek P. Collins reshared this.

A pure CSS carousel without any JavaScript. The magic of #CSS and #HTML 🪄✨

Demo: https://codepen.io/jwjertzoch/pen/JjyGeRy

#WebDev

https://levelup.gitconnected.com/how-to-make-a-fully-accessible-css-only-carousel-40e8bd62032b

How to Make a Fully Accessible CSS-Only Carousel - Level Up Coding

First of all, what is a carousel? Carousels show a collection of elements one after the other. Also known as “slideshows” and “sliders”. Often these are used to accommodate a larger amount of content…
Jennifer Wjertzoch (Level Up Coding)

4 people reshared this

Laimis
Laimis  
•
pure CSS "people" are magicians
Custom form controls (select, checkbox, radio) with #HTML and #CSS (without JavaScript): https://www.damianwajer.com/blog/custom-styled-form-controls/

#WebDev

CSS-only custom-styled select, checkbox, radio example (without JavaScript) - Damian Wajer

Whenever possible, I try to use native HTML elements to take full advantage of the built-in accessibility and usability benefits that come with them. Such benefits are sometimes…
Damian Wajer
I highly recommend Emmet, a plugin for many popular code editors that significantly boosts productivity when working with #HTML and #CSS. If you're not familiar with it, give it a try: https://emmet.io
#WebDev
Accessible card component with the pseudo-content trick: https://www.damianwajer.com/blog/accessible-card-component/

#WebDev #HTML #CSS #Accessibility
Random array using the modern Fisher–Yates shuffle algorithm in JavaScript: https://www.damianwajer.com/blog/random-array-the-modern-fisher-yates-shuffle-algorithm/

#WebDev #JavaScript

Random array using the modern Fisher–Yates shuffle algorithm in JavaScript - Damian Wajer

How to make sure the randomness is really random. It might be tempting to use just Math.random() but it will not produce fair results. The Fisher–Yates shuffle algorithm…
Damian Wajer
Be the browser’s mentor, not its micromanager.
Give the browser some solid rules and hints, then let it make the right decisions for the people that visit it, based on their device, connection quality and capabilities. This is how they will get a genuinely great user experience, rather than a fragmented, broken one.

https://buildexcellentwebsit.es/

#Webdev #UXDesign #UX

Be the browser’s mentor, not its micromanager. - Build Excellent Websites

Key principles using modern CSS, fluid type, fluid space, flexible layout and progressive enhancement will help you to build better front-ends that work for everyone.
Build Excellent Websites
⇧