Data-URL-enerieren


Quell Code


<script>

    window.onload = function() {

      if ( document.getElementById('output') ) {

         document.getElementById('output').addEventListener('click',

         function () {

            if ( document.selection ) {

                var range = document.body.createTextRange();

                range.moveToElementText(this);

                range.select();

            } else if ( window.getSelection ) {

                var range = document.createRange();

                range.selectNode(this);

                window.getSelection().addRange(range);

            }

         }

         , false);

      }

    }

    </script>
    <style>
    #content {padding:1em 1em 1em 1em;}

    p.errorText {background-color:#fdd;padding:.5em;border:1px solid #a00;}

    label:hover{text-decoration:underline;}

    legend{font-weight:bold;font-size:90%; padding: 0 1em 0 1em; }

    fieldset{border:2px solid #ddd;border-radius:.5em;width:20em;margin-bottom:.5em;}

    #output {width:auto;height:auto;font-family:monospace;font-size:.95em;border:3px solid gray;padding:.5em;margin-right:1em;white-space:nowrap; overflow:scroll;}

    </style>
  <body>

    <h1>Data-URI-Generator für Inline-Grafiken</h1>
<h2 style="color:red">Nicht funktionstüchtig , nur Demo</h2>
    <div id="content">

        <form id="myForm" action="" method="post" enctype="multipart/form-data">

      <fieldset><legend>Datei: (maximal 64 KibiBytes)</legend>

        <input id="Datei" name="Datei" type="file" size="50" accept="image/*" required><br />

      </fieldset>

      <fieldset><legend>Typ:</legend>

        <input type="radio" checked name="typ" value="html" id="getHTML"><label for="getHTML">HTML</label><br />

        <input type="radio"  name="typ" value="css"  id="getCSS"><label for="getCSS">CSS (als Hintergrund)</label><br />

        <input type="radio"  name="typ" value="base64" id="getBase64"><label for="getBase64">nur base64-codiert (Plaintext)</label><br />

       </fieldset>

       <button id="mySubmit" type="submit">Data-URL generieren</button>

    </form>

            <p>Das Skript (<a href="https://code.fastix.org/Projekte/Data-URL-Generator/">Download</a>) hat auf einem <br />

 und PHP 7.2.20 etwa 10 Millisekunde(n) benötigt.</p>

        </div>

  </body>