Utilisation du navigateur Web comme bloc-notes en ligne

En lisant mon RSS, je trouve un article dans VeryComputer ce qui conduit à son tour à un poster de José Jesús Pérez Aguinaga, où il nous montre comment utiliser le format URI de données qui, avec la puissance de HTML5 et un nouvel élément appelé 'contenu modifiable', nous permet de créer une page HTML que nous pouvons utiliser comme bloc-notes.

Il suffit de mettre dans la barre d'adresse:

data:text/html, <html contenteditable>

Dans le poster par José Jesús Pérez Aguinaga, quelques autres exemples qui méritent d'être examinés apparaissent à travers les commentaires:

data:text/html, <textarea style="font-size: 1.5em; width: 100%; height: 100%; border: none; outline: none" autofocus />
data:text/html, <html><head><link href='http://fonts.googleapis.com/css?family=Open+Sans' rel='stylesheet' type='text/css'><style type="text/css"> html { font-family: "Open Sans" } * { -webkit-transition: all linear 1s; }</style><script>window.onload=function(){var e=false;var t=0;setInterval(function(){if(!e){t=Math.round(Math.max(0,t-Math.max(t/3,1)))}var n=(255-t*2).toString(16);document.body.style.backgroundColor="#ff"+n+""+n},1e3);var n=null;document.onkeydown=function(){t=Math.min(128,t+2);e=true;clearTimeout(n);n=setTimeout(function(){e=false},1500)}}</script></head><body contenteditable style="font-size:2rem;line-height:1.4;max-width:60rem;margin:0 auto;padding:4rem;">
data:text/html, <body contenteditable style="font-size:2rem;line-height:1.4;max-width:60rem;margin:0 auto;padding:4rem;">
data:text/html, <title>Text Editor</title><body contenteditable style="font-size:2rem;line-height:1.4;max-width:60rem;margin:0 auto;padding:4rem;">

Je l'ai essayé Firefox y Chrome et cela fonctionne parfaitement .. Je suppose que cela devrait fonctionner dans n'importe quel autre navigateur prenant en charge HTML5 😀


Laisser un commentaire

Votre adresse e-mail ne sera pas publiée. Les champs obligatoires sont marqués avec *

*

*

  1. Responsable des données: Miguel Ángel Gatón
  2. Finalité des données: Contrôle du SPAM, gestion des commentaires.
  3. Légitimation: votre consentement
  4. Communication des données: Les données ne seront pas communiquées à des tiers sauf obligation légale.
  5. Stockage des données: base de données hébergée par Occentus Networks (EU)
  6. Droits: à tout moment, vous pouvez limiter, récupérer et supprimer vos informations.

  1.   Pourritures87 dit

    hahaha curiosités de html5 je suppose que cela me servira à un moment donné au lieu d'ouvrir un autre éditeur ... merci

  2.   Wow dit

    Homme, le véritable utilitaire que je vois est de voir à quoi ressemblerait un code html (si vous concevez quelque chose en html). Laissez-moi vous expliquer: dans la barre d'adresse, vous mettez toutes les options html, puis écrivez ce que vous voulez, afin que vous puissiez voir un "aperçu à chaud", sans avoir à utiliser un éditeur avec des options d'affichage html ou à enregistrer des fichiers et à les ouvrir avec le navigateur .

  3.   sieg84 dit

    fonctionne également à Opera

    1.    Cristianhcd dit

      Je préfère mille fois les notes intégrées dans le navigateur, ce qui est habituel

  4.   écoslacker dit

    Cela peut ne pas intéresser beaucoup, mais dans Konqueror, cela fonctionne.

    Salutations.

  5.   Élynx dit

    ummm… l'art de l'innovation 😉

    Eh bien (et)… Salutations!

  6.   cronos dit

    Très intéressant, tout ce qui est intégré dans le navigateur n'est pas une mauvaise idée, et apparemment cela se produira avec HTML5.

  7.   Daniel c dit

    Ce buinisiimooo, c'était bien pour moi je cherchais quelque chose comme ça sans avoir à installer quelque chose google web store

  8.   dae dit

    cela fonctionne avec vivaldi, et l'explorateur de fichiers fonctionne également pour vous:
    fichier: // localhost /