GeezerVisonThe World Wide Web, restored to 800 pixels of glory. |
| Home|About|Gaming cabinet|Archives|How it works|Starter sites |
GeezerVison is showing github.com — JavaScript-Load-Image/index.html at master · renz45/JavaScript-Load-Image Expand file tree/ Copy pathindex.htmlMore file actions 157 lines (157 loc) · 5.73 KB / Copy pathindex.htmlFile metadata and controls157 lines (157 loc) · 5.73 KB 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129 130 131 132 133 134 135 136 137 138 139 140 141 142 143 144 145 146 147 148 149 150 151 152 153 154 155 156 157 <!DOCTYPE html> <!-- /* * JavaScript Load Image Demo * https://github.com/blueimp/JavaScript-Load-Image * * Copyright 2011, Sebastian Tschan * https://blueimp.net * * Licensed under the MIT license: * https://opensource.org/licenses/MIT */ --> <html lang="en"> <head> <!--[if IE]> <meta http-equiv="X-UA-Compatible" content="IE=edge" /> <![endif]--> <meta charset="utf-8" /> <title>JavaScript Load Image</title> <meta name="description" content="JavaScript Load Image is a library to load images provided as File or Blob objects or via URL. It returns an optionally scaled, cropped or rotated HTML img or canvas element. It also provides methods to parse image metadata to extract IPTC and Exif tags as well as embedded thumbnail images, to overwrite the Exif Orientation value and to restore the complete image header after resizing." /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <!-- Jcrop is not required by JavaScript Load Image, but included for the demo --> <link rel="stylesheet" href="css/vendor/jquery.Jcrop.css" /> <link rel="stylesheet" href="css/demo.css" /> <!--[if lt IE 9]> <script> // Basic HTML5 elements support: 'figure figcaption'.replace(/\w+/g, function (n) { document.createElement(n) }) </script> <![endif]--> </head> <body> <h1>JavaScript Load Image Demo</h1> <p> <a href="https://github.com/blueimp/JavaScript-Load-Image" >JavaScript Load Image</a > is a library to load images provided as <a href="https://developer.mozilla.org/en-US/docs/Web/API/File">File</a> or <a href="https://developer.mozilla.org/en-US/docs/Web/API/Blob">Blob</a> objects or via URL.<br /> It returns an optionally <strong>scaled</strong>, <strong>cropped</strong> or <strong>rotated</strong> HTML <a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Element/Img" >img</a > or <a href="https://developer.mozilla.org/en-US/docs/Web/API/Canvas_API" >canvas</a > element. </p> <p> It also provides methods to parse image metadata to extract <a href="https://iptc.org/standards/photo-metadata/">IPTC</a> and <a href="https://en.wikipedia.org/wiki/Exif">Exif</a> tags as well as embedded thumbnail images, to overwrite the Exif Orientation value and to restore the complete image header after resizing. </p> <ul id="navigation"> <li> <a href="https://github.com/blueimp/JavaScript-Load-Image/releases" >Download</a > </li> <li> <a href="https://github.com/blueimp/JavaScript-Load-Image" >Source Code</a > </li> <li> <a href="https://github.com/blueimp/JavaScript-Load-Image/blob/master/README.md" >Documentation</a > </li> <li><a href="test/">Test</a></li> <li><a href="https://blueimp.net">© Sebastian Tschan</a></li> </ul> <h2>Select an image file</h2> <p> <input type="file" id="file-input" /> </p> <p> <label for="url">Or enter an image URL into the following field:</label> <input type="url" id="url" placeholder="Image URL" /> </p> <p>Or <strong>drag & drop</strong> an image file onto this webpage.</p> <h3>Options</h3> <p> <label for="orientation">Orientation:</label> <select id="orientation"> <option value="-1">undefined: Browser default</option> <option value="0" selected>true: Automatic</option> <option value="1">1: Original</option> <option value="2">2: Horizontal flip</option> <option value="3">3: Rotate 180° CCW</option> <option value="4">4: Vertical flip</option> <option value="5">5: Vertical flip + Rotate 90° CW</option> <option value="6">6: Rotate 90° CW</option> <option value="7">7: Horizontal flip + Rotate 90° CW</option> <option value="8">8: Rotate 90° CCW</option> </select> </p> <p> <input type="checkbox" id="image-smoothing" checked /> <label for="image-smoothing">Image smoothing</label> </p> <h2>Result</h2> <p id="actions" style="display: none;"> <button type="button" id="edit">Edit</button> <button type="submit" id="crop">Crop</button> <button type="reset" id="cancel">Cancel</button> </p> <figure id="result"> <figcaption style="display: none;"> Loading images from File objects requires support for the <a href="https://developer.mozilla.org/en-US/docs/Web/API/URL">URL</a> or <a href="https://developer.mozilla.org/en-US/docs/Web/API/FileReader" >FileReader</a > API. </figcaption> </figure> <div id="meta" style="display: none;"> <h3>Image metadata</h3> <figure id="thumbnail" style="display: none;"></figure> </div> <script src="js/vendor/canvas-to-blob.js"></script> <script src="js/load-image.js"></script> <script src="js/load-image-scale.js"></script> <script src="js/load-image-meta.js"></script> <script src="js/load-image-fetch.js"></script> <script src="js/load-image-orientation.js"></script> <script src="js/load-image-exif.js"></script> <script src="js/load-image-exif-map.js"></script> <script src="js/load-image-iptc.js"></script> <script src="js/load-image-iptc-map.js"></script> <!-- jQuery and Jcrop are not required by JavaScript Load Image, but included for the demo --> <script src="js/vendor/jquery.js"></script> <script src="js/vendor/jquery.Jcrop.js"></script> <script src="js/demo/demo.js"></script> </body> </html> |
| You are visitor 01402520 — GeezerVison does not store the pages you look up. Best viewed with Netscape Navigator 4.7 or Internet Explorer 6 at 800×600. No cookies required. |