Untitled
unknown
html
a year ago
2.5 kB
3
Indexable
Never
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width-device-width, initial-scale=1.0"> <title>CSS ASCII ART</title> <style> button.go, p.picbase, p.pictxt{ visibility: hidden; display: none; } </style> <script> function proceed() { var tx = document.getElementById("txt").value; var txx = tx.concat("\n"); var text = txx.repeat(1500); var reader = new FileReader(); reader.onload = function(e) { document.getElementByClassName('go').click(); document.getElementByClassName("picbase").value = e.target.result; document.getElementByClassName("pictxt").value = text; }; reader.readAsDataURL(input.files[0]); } </script> </head> <body> <?php if(isset($_POST['go'])) { echo '<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width-device-width, initial-scale=1.0"> <title>CSS ASCII ART</title> <style> p.art { font-size: 5px; line-height: 5px; text-align: justify; -webkit-background-size: cover; background-position: center; background-repeat: no-repeat; background-size: cover; -webkit-filter: grayscale(1) invert(0); filter: grayscale(1) invert(0); background: "url('.$pic.')"; background-attachment: fixed; -webkit-background-clip: text; -webkit-text-fill-color: rgba(255,255,255,0.2); } </style> </head> <body> <div id="artOrg"> <p class="art">'.$text.'</p> </div> </body> </html>'; } ?> <div class="formOrg"> <input type="file" id="myfile" name="myfile" onchange="readURL(this);" accept="image/*"><br><br> <input type="text" id="txt" name="txt" placeholder="Text..."><br><br> <button class="proceed" onclick="proceed()" onchange="readURL(this);">CREATE</button> <form method="post"> <button class="go" type="submit" name="go" value="go"></button> </form> <p class="picbase"></p> <p class="pictxt"></p> </div> <div id="artOrg"> <p id="art"></p> </div> </body> </html>