The Caesar Cipher
How do I make an the caesar cipher?
In cryptography, a Caesar cipher, also known as Caesar's cipher, the shift cipher, Caesar's code or Caesar shift, is one of the simplest and most widely known encryption techniques. It is a type of substitution cipher in which each letter in the plaintext is replaced by a letter some fixed number of positions down the alphabet. For example, with a left shift of 3, D would be replaced by A, E would become B, and so on. The method is named after Julius Caesar, who used it in his private correspondence.. What is a the caesar cipher? How do you make a the caesar cipher? This script and codes were developed by Joshua Michael Waggoner on 11 October 2022, Tuesday.
The Caesar Cipher Previews
The Caesar Cipher - Script Codes HTML Codes
<!DOCTYPE html>
<html >
<head> <meta charset="UTF-8"> <title>The Caesar Cipher</title> <link href='https://fonts.googleapis.com/css?family=Julius+Sans+One|Marcellus+SC|Anton' rel='stylesheet' type='text/css'>
<link href='https://fonts.googleapis.com/css?family=Ubuntu+Mono' rel='stylesheet' type='text/css'>
<meta name="viewport" content="width=device-width, initial-scale=1"> <link rel="stylesheet" href="css/style.css">
</head>
<body> <div id="wrapper"> <div id="header"> <h1>☠ The Caesar Cipher ☠</h1> <h2>Used by Romans for encryption</h2> <p>(Not suitable encryption... Probably why they dissapeared... This is just for fun)</p> </div> <div id="content"> <div class='plaintext'> <h3>Plaintext</h3> <p>- The plain msg -</p> <textarea id='plaintext' rows="4" cols="50">
IF YOU MUST BREAK THE LAW DO IT TO SEIZE POWER. IN ALL OTHER CASES OBSERVE IT -JULIUS CAESAR </textarea> <h3>Enter a shift value: </h3> <div> <input class="shift-l" type="number" min="0" max="25" step="1" value="3" /> <button class='btn-encrypt'>Encrypt!</button> </div> </div> <div class='cipher'> <h3>Ciphertext</h3> <p>- The encrypted msg -</p> <textarea id='ciphertext' rows="4" cols="50"> </textarea> <h3>Enter a shift value: </h3> <div> <input class="shift-r" type="number" min="0" max="25" step="1" value="3" /> <button class='btn-decrypt'>Decrypt!</button> </div> </div> </div> <div id='footer'> <footer>Hire me! [email protected] </footer> </div>
</div> <script src='http://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js'></script>
<script src='http://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.11.2/jquery-ui.min.js'></script> <script src="js/index.js"></script>
</body>
</html>The Caesar Cipher - Script Codes CSS Codes
/* Colors */
/* Fonts */
body { font-family: "Julius Sans One", sans-serif; background: #A52B2B; text-align: center; color: #EEE;
}
body h1 { letter-spacing: 0.25em;
}
body h2 { margin-top: -15px;
}
body p { margin-top: -10px;
}
body textarea { padding: 5px; border: 2px solid #333; -webkit-border-radius: 5px; border-radius: 5px; width: 350px; min-width: 100px; max-width: 300px; height: 100px; min-height: 100px; max-height: 100px; font-size: 1.2em; font-family: 'Ubuntu Mono'; color: #333; background-color: #EEE;
}
body button { display: inline; padding: 5px; border: 2px solid #333; -webkit-border-radius: 5px; border-radius: 5px; font-size: 1.2em; font-family: "Ubuntu Mono"; margin-left: 5px; margin-right: 80px; height: 32px;
}
body #header { margin-top: -10px; margin-left: 15%; margin-right: 15%; /*background-color: #333;*/ padding: 5px; border: 0px solid #333; -webkit-border-radius: 5px; border-radius: 5px;
}
body #content { text-align: center; display: block;
}
body #content .plaintext { display: inline-block;
}
body #content .cipher { display: inline-block;
}
body #footer { float: center; margin-left: 10px; margin-top: 35px; margin-bottom: 20px; display: block;
}
body .shift-l, body .shift-r { margin-left: 80px; width: 65px; height: 20px; padding: 5px; border: 2px solid #333; -webkit-border-radius: 5px; border-radius: 5px; font-family: "Ubuntu Mono"; font-size: 1.2em;
}
The Caesar Cipher - Script Codes JS Codes
/* * Caesar Cipher - CoffeeScript * [email protected] * Hire me! */
(function() { var charsDN, charsUP, modulo = function(a, b) { return (+a % (b = +b) + b) % b; }; charsUP = 'ABCDEFGHIJKLMNOPQRSTUVWXYZ'; charsDN = 'abcdefghijklmnopqrstuvwxyz'; /* * Encrypts the string using the * famous Caesar shift */ String.prototype.caesarShift = function(shift) { var c, i, result; result = ''; i = 0; while (i < this.length) { c = this.charCodeAt(i); if (c >= 65 && c <= 90) { result += charsUP[modulo(c - 65 + shift, 26)]; } else if (c >= 97 && c <= 122) { result += charsDN[modulo(c - 97 + shift, 26)]; } else { result += this.charAt(i); } i++; } return result; }; $('.btn-encrypt').click(function() { var cipher, shift, text; shift = modulo($('.shift-l').val(), 26); text = $('#plaintext').val(); cipher = text.caesarShift(shift); $('#ciphertext').val(cipher); }); $('.btn-decrypt').click(function() { var plaintext, shift, text; shift = modulo($('.shift-r').val(), 26); text = $('#ciphertext').val(); plaintext = text.caesarShift(-shift); $('#plaintext').val(plaintext); }); $('.shift-r').change(function() { var plaintext, shift, text; shift = modulo($('.shift-r').val(), 26); text = $('#ciphertext').val(); plaintext = text.caesarShift(-shift); $('#plaintext').val(plaintext); });
}).call(this);
| Developer | Joshua Michael Waggoner |
| Username | rabbitfighter81 |
| Uploaded | October 11, 2022 |
| Rating | 3 |
| Size | 4,717 Kb |
| Views | 12,144 |
Do you need developer help for The Caesar Cipher?
Find the perfect freelance services for your business! Fiverr's mission is to change how the world works together. Fiverr connects businesses with freelancers offering digital services in 500+ categories. Find Developer!
Joshua Michael Waggoner (rabbitfighter81) Script Codes
| Name | Size |
| RGFX Toasts | 5,405 Kb |
| How to Mount and Unmount React Components | 3,734 Kb |
| ES6 Random Color Text | 3,505 Kb |
| React SearchBox | 4,521 Kb |
| Running Man Sprite Demo | 4,003 Kb |
| Quiz - Question4 | 2,559 Kb |
| React.js Search Box | 5,909 Kb |
| A Pen by Joshua Michael Waggoner | 4,218 Kb |
| Denver Broncos Arrests Since January 1, 2000 | 11,439 Kb |
| Three.js intro | 2,040 Kb |
Create amazing sales emails with AI!
Jasper is the AI Content Generator that helps you and your team break through creative blocks to create amazing, original content 10X faster. Discover all the ways the Jasper AI Content Platform can help streamline your creative workflows. Start For Free!
Similar Scripts & Codes
| Name | Username | Size |
| Wikipedia Viewer | Codinger | 4,681 Kb |
| Very Simple Slider | Doodlemarks | 2,682 Kb |
| Nav Test -- cats 1 | Payls | 4,735 Kb |
| Ipad Mini Showcase | Hornebom | 10,479 Kb |
| Long Shadow Button | Uixcrazy | 3,550 Kb |
| Atom | Bhlaird | 1,932 Kb |
| Twitch TV | Natester13 | 4,488 Kb |
| Retina canvas w. resize | Erikterwan | 1,882 Kb |
| CSS3 Media Queries demo | Machal | 1,824 Kb |
| Animate a paper plane along an SVG path, looking ahead | PotatoDie | 3,734 Kb |
Do you want hide your ip address?
Surf anonymously, prevent hackers from acquiring your IP address, send anonymous email, and encrypt your Internet connection. High speed, ultra secure, and easy to use. Instant setup. Hide Your IP Now!