ASTUCE: Body qui apparait après chargement en 2 lignes

Un truc que je teste sur ma page de générateur de comics pour masquer le chargement de la page...

Minimaliste...


/* Dans le Head */
<style type="text/css">body{opacity: 0;transition: opacity 1s}
/* balise body */
<body onload="document.body.style.opacity=1" >

- HTML (HyperText Markup Language) | MDN

Le jour où tu t'aperçois comme un abruti que l'input de type range prévoit la possibilité d'ajouter des repères et même des repères avec des labels !

Genre:

<input type="range" list="tickmarks">
<datalist id="tickmarks">
  <option value="0" label="0%">
  <option value="10">
  <option value="20">
  <option value="30">
  <option value="40">
  <option value="50" label="50%">
  <option value="60">
  <option value="70">
  <option value="80">
  <option value="90">
  <option value="100" label="100%">
</datalist>
Est-ce que je deviens trop   vieux pour tout ça ?!

EDIT: Ha mais c'est pas standardisé, tous les navigateurs ne l'utilisent pas... firefox par exemple...

OUF !  C'est pas moi le problème !

Hardware boot selection switch | Hackaday.io

Excellente idée... il existe même des switches tout prêts dans le commerce: j'en avais un avec 4 interrupteurs, un par HD.

Les gros avantages:

  1. ça IMPOSE le choix à windows, même s'il fait chier
  2. ça CLOISONNE les systèmes entre-eux: si une saloperie chopée sous win veut te poutrer les HD -> dans son cul.
  3. ça SOULAGE l'alim (la mienne a l'air de donner des signes de fatigue, je sens que ça va être ma prochaine galère)
Via https://shaar.libox.fr/?y56PlA

How to Fix 0x80070424 Windows 10 Update Error [2020] - YouTube

Depuis un bon moment, j'avais un souci de mises à jour bloquées sous win...

Comme je ne m'en sers que pour jouer, je ne m'en faisais pas trop. Mais quand ta fille vient te voir, les larmes aux yeux en te disant que le PC «y n'arrête pas de planter» quand elle joue... tu retrousses tes manches.

Bref: si vous avez une erreur de windows update sous win 10 [0x80070424], il faut:

  • installer la clé de registre du fichier suivant: w10-wuauserv.reg
  • redémarrer
  • aller dans le gestionnaire des tâches>onglet services>lien ouvrir les services en bas, chercher windows update et le mettre en démarrage auto (et le démarrer si nécessaire)
  • redémarrer la bécane
  • aller dans windows update et relancer le bouzin

Normalement, ça doit remarcher.



CSS Tips - Marko Denic - Web Developer

Je suis fan de ces astuces minimalistes...

  • filter:drop-shadow(2px 4px 8px #585858); pour faire une ombre sur des images à fond transparent.
  • scroll-behavior: smooth; pour activer le smooth scroll
  • .center { display: flex; align-items: center; justify-content: center; } pour centrer horizontalement et verticalement
  • white-space: nowrap; overflow: hidden; text-overflow: ellipsis; pour tronquer un texte
  • caret-color:red pour changer la couleur du curseur de texte

Ou encore la fenêtre modale SANS javascript:


/* If you like this, be sure to ❤️ it. */
.wrapper {
  height: 100vh;
  /* This part is important for centering the content */
  display: flex;
  align-items: center;
  justify-content: center;
  /* End center */
  background: -webkit-linear-gradient(to right, #834d9b, #d04ed6);
  background: linear-gradient(to right, #834d9b, #d04ed6);
}

.wrapper a {
  display: inline-block;
  text-decoration: none;
  padding: 15px;
  background-color: #fff;
  border-radius: 3px;
  text-transform: uppercase;
  color: #585858;
  font-family: 'Roboto', sans-serif;
}

.modal {
  visibility: hidden;
  opacity: 0;
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(77, 77, 77, .7);
  transition: all .4s;
}

.modal:target {
  visibility: visible;
  opacity: 1;
}

.modal__content {
  border-radius: 4px;
  position: relative;
  width: 500px;
  max-width: 90%;
  background: #fff;
  padding: 1em 2em;
}

.modal__footer {
  text-align: right;
  a {
    color: #585858;
  }
  i {
    color: #d02d2c;
  }
}
.modal__close {
  position: absolute;
  top: 10px;
  right: 10px;
  color: #585858;
  text-decoration: none;
}
Via https://sebsauvage.net/links/
Fil RSS des articles