This time I want to share a small range slider (progress bar) I built. Check the demo. Code and documentation are available here.

Same story again, on a React project we needed a media progress bar, and I ended up writing one myself.

Why I didn’t like anything I found? Well, everything I tried was missing one of the things we considered mandatory - good touch support, accessibility (aria attributes, keyboard control), callbacks or easy styling.

Let me start with a little disclaimer. Just because you can, doesn’t mean you should use it. Hiding scrollbars can be bad for accessibility and user experience.

But there are rare cases where it makes sense, usually when you have scrolling effects or when modal is opened. So use it wisely.

Check the demo. And find the cross browser code below:

Exactly ten years ago, on my my friend’s blog I published a blog post about Internet Explorer 6 CSS hacks. I remembered it recently, and thought it would be really cool if I republished that same post, on it’s 10th anniversary.

I added comments about the hacks from today’s perspective to give you some context. Cited parts are from the original post. Younger developers may find some things unbelievable, because browsers came a long way in the last ten years :)

So here it is.

Few days ago, I was chatting with our design team, and we were wondering how hard would be to create a fake audio spectrum (that mimics human speech) and visualize it. I immediately said it should be easy, and that I will play with it over the weekend. Of course, I didn’t wait for the weekend, but wrote it the same evening. It was fairly straightforward, but it had few gotchas.

Result

Before you start playing with the checkboxes I advise you to read the rest of this post.

Use random value Use static sample Use perlin noise value

I want to brag a little - my npm packages have been downloaded more than 1 million times Stats are coming from npm-stat.com. this year!

And I finally got a real domain:

https://muffinman.io/

I’ve been quiet for the last couple of months. Mostly because I was busy with other things, both work and personal. But I do have a few small side projects I will be sharing soon.

Stay tuned!