Notice: Undefined variable: root in /users/basti1012/www/index1.php on line 41
Knack den Code

Knack den Code

Versuche den Code zu knacken , ohne in den Quelltext zu schauen.

Der hier verwendete Code

<html> <head> <style> html { overflow: hidden; } body { text-align: center; background-color: #222222; padding: 10px; } DIV { box-sizing: border-box; } #rotors { padding: 20px; margin: 0px auto; width: 280px; cursor: pointer; } .rotor { float: left; margin:0px 20px; width:30px; height:130px; border: 4px solid black; border-radius: 5px; background: rgb(0,0,0); background: linear-gradient(0deg, rgba(0,0,0,1) 0%, rgba(42,42,42,1) 2%, rgba(245,245,245,1) 28%, rgba(52,52,52,1) 30%, rgba(216,216,216,1) 31%, rgba(255,255,255,1) 50%, rgba(212,212,212,1) 67%, rgba(45,45,45,1) 69%, rgba(226,226,226,1) 70%, rgba(42,42,42,1) 98%, rgba(0,0,0,1) 100%); } .letter { font-family: Tahoma; color: #222222; font-size: 12pt; padding-top: 11px; padding-bottom: 11px; text-shadow: 0px 1px #AAAAAA; } .nextLetter:hover { background-color: rgba(0,0,0,0.6); background: -moz-linear-gradient(top, rgba(0,0,0,0.6) 0%, rgba(0,0,0,0) 100%); background: -webkit-linear-gradient(top, rgba(0,0,0,0.6) 0%,rgba(0,0,0,0) 100%); background: linear-gradient(to bottom, rgba(0,0,0,0.6) 0%,rgba(0,0,0,0) 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='rgba(0,0,0,0.6)', endColorstr='rgba(0,0,0,0)',GradientType=0 ); } .previousLetter:hover { background-color: rgba(0,0,0,0.6); background: -moz-linear-gradient(top, rgba(0,0,0,0) 0%, rgba(0,0,0,0.6) 100%); background: -webkit-linear-gradient(top, rgba(0,0,0,0) 0%,rgba(0,0,0,0.6) 100%); background: linear-gradient(to bottom, rgba(0,0,0,0) 0%,rgba(0,0,0,0.6) 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='rgba(0,0,0,0.6)', endColorstr='rgba(0,0,0,0)',GradientType=0 ); } .currentLetter:hover { background-color: rgba(0,0,0,0.3); background: -moz-linear-gradient(top, rgba(0,0,0,0) 0%, rgba(0,0,0,0.6) 50%, rgba(0,0,0,0) 100%); background: -webkit-linear-gradient(top, rgba(0,0,0,0) 0%, rgba(0,0,0,0.6) 50%,rgba(0,0,0,0) 100%); background: linear-gradient(to bottom, rgba(0,0,0,0) 0%, rgba(0,0,0,0.6) 50%,rgba(0,0,0,0) 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='rgba(0,0,0,0.6)', endColorstr='rgba(0,0,0,0)',GradientType=0 ); } #padlock { margin: 160px auto 20px auto; width: 250px; border-radius:10px; background: rgba(241,231,103,1); background: -moz-linear-gradient(left, rgba(241,231,103,1) 0%, rgba(254,182,69,1) 100%); background: -webkit-gradient(left top, right top, color-stop(0%, rgba(241,231,103,1)), color-stop(100%, rgba(254,182,69,1))); background: -webkit-linear-gradient(left, rgba(241,231,103,1) 0%, rgba(254,182,69,1) 100%); background: -o-linear-gradient(left, rgba(241,231,103,1) 0%, rgba(254,182,69,1) 100%); background: -ms-linear-gradient(left, rgba(241,231,103,1) 0%, rgba(254,182,69,1) 100%); background: linear-gradient(to right, rgba(241,231,103,1) 0%, rgba(254,182,69,1) 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f1e767', endColorstr='#feb645', GradientType=1 ); -webkit-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.75); -moz-box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.75); box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.75); } #unlock { clear: both; margin: 20px auto; width:160px; height:40px; border: 4px solid black; border-radius: 5px; background: rgb(0,0,0); background: linear-gradient(0deg, rgba(0,0,0,1) 0%, rgba(42,42,42,1) 2%, rgba(245,245,245,1) 28%, rgba(216,216,216,1) 31%, rgba(255,255,255,1) 50%, rgba(212,212,212,1) 67%, rgba(226,226,226,1) 70%, rgba(42,42,42,1) 98%, rgba(0,0,0,1) 100%); } #unlock:hover { cursor: pointer; background: linear-gradient(0deg, rgba(0,0,0,1) 0%, rgba(30,30,30,1) 2%, rgba(230,230,230,1) 28%, rgba(200,200,200,1) 31%, rgba(230,230,230,1) 50%, rgba(200,200,200,1) 67%, rgba(200,200,200,1) 70%, rgba(20,20,20,1) 98%, rgba(0,0,0,1) 100%); } #unlock:active { border: 4px solid #222222; } #padlock.unlock::before { transform: translate(-50%, -60%); } #padlock.unlock::after { transform: translate(-50%, calc(-50% - 15px)) rotate(90deg); } #padlock::before { content: ""; position: absolute; left: 50%; z-index: -1; width: 100px; height: 200px; border-radius: 125px; border: 36px solid #AAAAAA; -webkit-box-shadow: 2px 2px 5px 2px rgba(0,0,0,0.75); -moz-box-shadow: 2px 2px 5px 2px rgba(0,0,0,0.75); box-shadow: 2px 2px 5px 2px rgba(0,0,0,0.75); transform: translate(-50%, -50%); transition: transform 300ms cubic-bezier(0.17, 0.67, 0.65, 1.52); -webkit-clip-path: polygon(0% 0%, 100% 0%, 100% 65%, 50% 65%, 50% 57%, 22% 57%, 22% 51%, 15% 51%, 14% 52%, 14% 53%, 15% 54%, 22% 54%, 18% 57%, 2% 57%, 0% 55%); clip-path: polygon(0% 0%, 100% 0%, 100% 65%, 50% 65%, 50% 57%, 22% 57%, 22% 51%, 15% 51%, 14% 52%, 14% 53%, 15% 54%, 22% 54%, 18% 57%, 2% 57%, 0% 55%); } .popup{ width: 100%; position: absolute; top: 110px; z-index: 101; } .message{ min-width: 80%; width: 80%; min-height: 150px; margin: 80px auto; background: #f3f3f3; position: relative; z-index: 103; padding: 15px 35px; border-radius: 5px; box-shadow: 0 2px 5px #000; } .message p{ clear: both; color: #555555; /* text-align: justify; */ font-size: 20px; font-family: sans-serif; } .message p a{ color: #d91900; font-weight: bold; text-decoration: none; cursor: pointer; } </style> </head> <body> <div id="padlock"> <div id="rotors"> <div class="rotor" id="rotor1"> <div class="letter nextLetter" id="rotor1Next" onclick="changeRotor(1,-1);">9</div> <div class="letter currentLetter" id="rotor1Current">0</div> <div class="letter previousLetter" id="rotor1Previous" onclick="changeRotor(1,1);">1</div> </div> <div class="rotor" id="rotor2"> <div class="letter nextLetter" id="rotor2Next" onclick="changeRotor(2,-1);">9</div> <div class="letter currentLetter" id="rotor2Current">0</div> <div class="letter previousLetter" id="rotor2Previous" onclick="changeRotor(2,1);">1</div> </div> <div class="rotor" id="rotor3"> <div class="letter nextLetter" id="rotor3Next" onclick="changeRotor(3,-1);">9</div> <div class="letter currentLetter" id="rotor3Current">0</div> <div class="letter previousLetter" id="rotor3Previous" onclick="changeRotor(3,1);">1</div> </div> </div> <button id="unlock" onclick="unlock();">Unlock?</button> </div> <div class="popup" id="popup1" style="display: none;"> <div class="message"> <h1>Wrong Code!</h1> <p> Please try again with a different code. <br> <br> <a class="close" onclick="document.getElementById('popup1').style.display='none';">Close</a> </p> </div> </div> <div class="popup" id="popup2" style="display: none;"> <div class="message"> <h1>Correct Code!</h1> <p> You have found the correct combination! Challenge solved!. <br> <br> <a class="close" onclick="document.getElementById('popup2').style.display='none';">Close</a> </p> </div> </div> <!-- <input type="button" onclick="replay()" value="Neuer Versuch"> --> <script>document.addEventListener('contextmenu', event => event.preventDefault());</script> <script> function getRandomInt(max) { dd=Math.floor(Math.random() * Math.floor(max)); console.log(dd); return dd; } var numbers = [0,0,0]; var pass = [1,1,1];//[getRandomInt(9),getRandomInt(9),getRandomInt(9)]; function changeRotor(rotor,step) { var num = (numbers[rotor-1]-step)%10; if (num==-1) num=9; numbers[rotor-1] = num; document.getElementById("rotor"+rotor+"Current").innerText=num; document.getElementById("rotor"+rotor+"Previous").innerText=(num+1)%10; num = (num-1)%10; if (num==-1) num=9; document.getElementById("rotor"+rotor+"Next").innerText=num; } function unlock() { if ((numbers[0]==pass[0]) && (numbers[1]==pass[1]) && (numbers[2]==pass[2])) { document.getElementById("padlock").className = "unlock"; document.getElementById("popup1").style.display = "none"; document.getElementById("popup2").style.display = "block"; } else { document.getElementById("popup2").style.display = "none"; document.getElementById("popup1").style.display = "block"; } } </script>