RookieChecker
<html> <head> <meta name="viewport" content="width=device-width, initial-scale=1"> <style> @import url(http://d3g0gp89917ko0.cloudfront.net/v--de24f08b1628/common--theme/base/css/style.css); @import url(http://d3g0gp89917ko0.cloudfront.net/v--de24f08b1628/common--theme/shiny/css/style.css); @import url(http://scp-jp.wdfiles.com/local--theme/scp-sigma-9-off-canvas/style.css); body { background: transparent; margin: 2em 1em; } form { font-family: Verdana; } * { box-sizing: border-box; } .input-container { display: -ms-flexbox; /* IE10 */ display: flex; width: 100%; margin-bottom: 15px; } .input-field:focus { border-style: solid; transition: 0.5; border-color: maroon; border-width: 2px; } .input-field { width: 100%; padding: 10px; outline: none; transition: 0.5s; text-align: center; } #loginbtn, #link { background-color: Maroon; color: white; padding: 10px 20px; border: none; cursor: pointer; width: 50%; opacity: 0.9; transition: 0.09s; border-radius: 3px; transition 0.8s; } #loginbtn:focus, #link:focus { outline: 0; } #loginbtn:hover, #link:hover { opacity: 1; transition: 0.5s; box-shadow: 1px 1px 4px 0 rgba(0, 0, 0, 0.1); } #loginbtn:active, #link:active { transition: 0.09s; transform: translateY(1px); box-shadow: 0 0px 0px 0 rgba(0, 0, 0, 0); } p { font-family: Helvetica; margin-bottom: 5%; } </style> <script> function linkupdate() { //GET INPUT var inputusername = document.getElementById("usr").value; if (inputusername.length > 0) { parent.location.href = "http://scp-jp.wikidot.com/author:ukwhatn/rookie_created_by/" + inputusername + "/#rookie"; } else { alert("ユーザー名を入力してください"); } } </script> </head> <body> <form onsubmit="return linkupdate()" autocomplete="off" style="max-width:450px;text-align:center;margin: auto;"> <div class="input-container"> <input id="usr" class="input-field" type="text" placeholder="ユーザー名を入力してください"> </div> <button id="loginbtn" class="btn" style="" type="button" onclick="linkupdate()">確認する</button> </form> </body> </html>
page revision: 4, last edited: 28 Apr 2020 12:30