Tag Archives: HTML

HTML Oninvalid Event Form Validation Pattern setCustomValidity Tutorial

The recent HTML Oninvalid Event Form Validation Primer Tutorial taught us that … in the client (ie. HTML and Javascript and CSS) side of the web application wooooorrrrrlllllddd it is best to involve a form … as much as anything … Continue reading

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

CSS Countdown Table Tutorial

What the user is lacking working the web application of yesterday’s CSS Countdown Emoji Tutorial is a … means by which to spread horizontally … to supplement the pre-existant … means by which to spread vertically With pre-existant div elements … Continue reading

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

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

Iframe Srcdoc Equals UTF-8 Issue Reveal Tutorial

Yesterday’s Iframe Srcdoc Equals UTF-8 Issue Primer Tutorial‘s … HTML iframe … [iframe].src=data:text/html;base64,[HTMLbase64Content] versus [iframe].srcdoc=atob([HTMLbase64Content]) nuance regarding … the display of UTF-8 data … is just that … nuanced, and hard to explain in terms of “what is the issue” … Continue reading

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

Iframe Srcdoc Equals UTF-8 Issue Primer Tutorial

Do you remember how with Javascript document.querySelectorAll Client Pre-emptive Iframe Tutorial, recently, we said … Why can’t we manage this new functionality in the one pass through the β€œonload” event logic? Well, any self-respecting webpage content will contain both apostrophe … Continue reading

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