Monthly Archives: February 2021

CSS Countdown Emoji Tutorial

A synopsis of the CSS highlights of the web application of yesterday’s CSS Countdown Reveal Tutorial are, so far … counter-increment counter-reset var (as in content: var(–tooltip-string);) … and today’s addition is … attr (as in content: attr(data-cnt);) … that … Continue reading

Posted in eLearning, Event-Driven Programming, Tutorials | Tagged , , , , , , , , , , , , , , , , , , , , | Leave a comment

CSS Countdown Reveal Tutorial

To improve on yesterday’s CSS Countdown Primer Tutorial we thought it would be good to give the user a chance to see as much above the fold as possible, and then “reveal” the larger images via details/summary element combinations. We … Continue reading

Posted in eLearning, Event-Driven Programming, Tutorials | Tagged , , , , , , , , , , , , , , , | Leave a comment

CSS Countdown Primer Tutorial

It’s not normally a talent you associate with CSS, the ability to do any maths, but you can count (or increment/decrement) with it, with styling like … <style> #myspan { counter-reset: the-final-countdown var(–tooltip-string); line-height: 2; } div::before { counter-increment: the-final-countdown … Continue reading

Posted in eLearning, Tutorials | Tagged , , , , , , , , , | Leave a comment

Javascript document.querySelector One Element Tutorial

Yes, adding a functionality layer on top of the recent Javascript document.querySelectorAll Share and Save Tutorial we turn our attention from document.querySelectorAll to … as well as a full scan of a CSS selection, allow for the honing in onto … Continue reading

Posted in eLearning, Event-Driven Programming, Tutorials | Tagged , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , | Leave a comment