Posts from category ‘Tutorials’

You have probably already used these shortcuts available at “force touch” or “long touch” on your mobile application icons? It’s a way to access shortcuts inside your application to quickly access a section, or directly start a more precise action. It is now possible to do this for your Progressive Web App (PWA).

Ones of the more painful experiences on mobile come with infinite online forms you have to fill in here and there. What about optimizing those experiences step by step? Today I propose to you a solution for One Time Code input: You receive the SMS with a code, your keyboard suggest-it to you, one tap, done! Ok let’s go!

CSS, since its version 2.1, offers a relatively unknown counter system due to an old incompatibility on IE. Some of you will probably defend the following position: CSS is not made for that, you have to use JavaScript. So be it! But know that it exists, and discover how to use it. Small introduction!

Not so long ago I saw one of the developers I work with writing a very complex function to allow a smooth scrolling to a lower element on the page. I was quite surprised that he doesn’t use scrollIntoView() and his behavior parameter and its smooth value. Did you heard of it?

When it comes the time to write rich copyrighting, you would love to know more about HTML5 attributes and rules to write accessible and efficient contents. Did you know that Ordered List (ol element) allows you to tweak some default values thanks to HTML attributes? Let’s find out how.

Some time ago, when I was doing research on customizable CSS radio buttons and checkboxes, I had in mind to do the same thing with the “file” form input. So I did a test in pure CSS. Then I left the idea aside.

In the past, I worked on several projects looking for a way to deal with custom styles proposed by some good designers to change the aspect like border color, check icon, animation, of form controls like checkbox, radio, file input, etc. As you may know, these elements are historically not style-able for accessibility reasons. (as I’ve heard). Still. I have a way to code custom accessible checkboxes and radio buttons for all devices. Ready?

You certainly already met those buttons to “Copy into Clipboard”. They usually use a trick made with Flash to overcome a security feature provided by our web browsers? Avec the evolution of JS API and the listening of developer requests, you can now (since some months) do it with JavaScript natively.

I recently worked on several websites, and the request for a sticky menu was almost systematic. Sometimes it was justified, sometimes I approached the stereotypical ergonomic counter-example. But still! Let’s see together how we can do that.

If you are a frequently user of JS, you have certainly noticed that some events are triggered quite occasionally, and others can be triggered very frequently and become quite difficult to manage, as in the case of “onscroll” and “onresize” for example.

I use the name “CSS3″ only for its “commercial” aspect. Actually, we will use my two favorite pseudo-elements :after and :before which are available since CSS2.1. I mean they are available since a long time ago… Demos you see in the demo page are composed with only one unique <div> and some CSS properties.