Açık kaynak kodlu yazılan konsol şeklinde uygulamaların ilk serisi web üzerinden hareketli scanning yazısı. Yalnızca CSS3 ve JS ile yazılmış olup görüntüsü yukarıdaki gibidir. Kodlar anlaşılabilir şekilde yazılmıştır. Geliştirilmesi ve değiştirilmesi sizlerin elinde.
Öncesinde veya sonrasında işlemler yaptırabilir, sitenizin açılışına koyabilir ve ya scanning yerine loading yazılarak yükleme ekranı olarak tasarlayabilirsiniz.
Canlı görüntüsü için:
http://kodblogum.com/consol/scanning/
HTML:
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 |
<!DOCTYPE html> <html > <head> <meta charset="UTF-8"> <title>Grayscale</title> <link rel="stylesheet" href="style.css"> </head> <body> <div class="msg">Scanning</div> <div id="console"> </div> <script src="js.js"></script> </body> </html> |
CSS:
|
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 |
body { margin: 0; padding: 5vh 5vw; background: black; overflow:hidden; } * { box-sizing: border-box; } p { font-family: monospace; font-weight: bold; font-size: 4.1vh; margin: 0; padding: 0; line-height: 1; color: limegreen; text-shadow: 0px 0px 10px limegreen; } .msg { font-family: monospace; font-weight: bold; text-transform: uppercase; font-size: 5vh; padding-top: 5vh; background: red; box-shadow: 0 0 30px red; text-shadow: 0 0 20px white; color: white; width: 20vw; height: 15vh; position: absolute; left: 50%; margin-left: -10vw; top: 50%; margin-top: -5vh; text-align: center; min-width: 200px; animation-name: blink; animation-duration: 0.6s; animation-iteration-count: infinite; animation-direction: alternate; animation-timing-function: linear; } @keyframes blink { 0% { opacity: 0; } 100% { opacity: 1; } } |
JAVASCRIPT:
|
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 |
var intervalID = window.setInterval(updateScreen, 200); var c = document.getElementById("console"); var txt = [ "FORCE: XX0022. ENCYPT://000.222.2345", "TRYPASS: ********* AUTH CODE: ALPHA GAMMA: 1___ PRIORITY 1", "RETRY: REINDEER FLOTILLA", "Z:> /FALKEN/GAMES/TICTACTOE/ EXECUTE -PLAYERS 0", "================================================", "Priority 1 // local / scanning...", "scanning ports...", "BACKDOOR FOUND (23.45.23.12.00000000)", "BACKDOOR FOUND (13.66.23.12.00110000)", "BACKDOOR FOUND (13.66.23.12.00110044)", "...", "...", "BRUTE.EXE -r -z", "...locating vulnerabilities...", "...vulnerabilities found...", "MCP/> DEPLOY CLU", "SCAN: __ 0100.0000.0554.0080", "SCAN: __ 0020.0000.0553.0080", "SCAN: __ 0001.0000.0554.0550", "SCAN: __ 0012.0000.0553.0030", "SCAN: __ 0100.0000.0554.0080", "SCAN: __ 0020.0000.0553.0080", ] var docfrag = document.createDocumentFragment(); function updateScreen() { txt.push(txt.shift()); txt.forEach(function(e) { var p = document.createElement("p"); p.textContent = e; docfrag.appendChild(p); }); while (c.firstChild) { c.removeChild(c.firstChild); } c.appendChild(docfrag); } |