xxxxxxxxxx52
<html lang="en"> <head> <script src="https://cdnjs.cloudflare.com/ajax/libs/p5.js/0.10.2/p5.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/p5.js/0.10.2/addons/p5.sound.min.js"></script> <link rel="stylesheet" type="text/css" href="style.css"> <link href="https://fonts.googleapis.com/css2?family=Megrim&family=Nanum+Gothic&display=swap" rel="stylesheet"> <meta charset="utf-8" /> </head> <body> <h1>Easy Wall Banner Generator</h1> <p> You can easily create a background pattern for a conference. Drag and drop the two types of images you want to use for the background pattern into the frame below. The available file formats are png and jpg. If the operation is unstable, please reload or restart your browser. <ul> <li>Author: Tetsuaki Baba, <a href="https://tetsuakibaba.jp">web</a>, <a href="https://www.facebook.com/tetsuakibaba">Facebook</a>, <a href="https://www.instagram.com/tetsuakibaba/">Instagram</a></li> <li>It works fine on Chrome browser. </li> <li>MIT License</li> </ul> </p> <div id="horizontal_flex"> <div id="vertical_flex"> <div id='dropzone1'><img src="https://placehold.jp/200x200.png?text=Drop a image"></div> <input type="color" id="colorPicker1_background" name="head" value="#1189DD"></input> <input type="color" id="colorPicker1" name="head" value="#999999"></input> <textarea id="text1">your text here</textarea> <input type="range" id="text1_slider" value="24" min="12" max="96" data-unit="pt"></input> </div> <div id="vertical_flex"> <div id='dropzone2'><img src="https://placehold.jp/200x200.png?text=Drop a image"></div> <input type="color" id="colorPicker2_background" name="head" value="#FFFFFF"></input> <input type="color" id="colorPicker2" name="head" value="#999999"></input> <textarea id="text2">your text here</textarea> <input type="range" id="text2_slider" value="24" min="12" max="96" data-unit="pt"></input> </div> <div id="vertical_flex"> test </div> </div> <script src="sketch.js"></script> </body></html>