Skip to content

Instantly share code, notes, and snippets.

@dursk

dursk/index.html

Created March 21, 2017 11:24
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save dursk/664ff72ef6d9fd2991e0fd95da8ef2cb to your computer and use it in GitHub Desktop.
Save dursk/664ff72ef6d9fd2991e0fd95da8ef2cb to your computer and use it in GitHub Desktop.
Download ZIP
Exported from Popcode. Click to import: https://popcode.org/?gist=664ff72ef6d9fd2991e0fd95da8ef2cb
Raw
index.html
<!DOCTYPE html>
<html>
<head>
<title>This is easy page</title>
<script src="https://code.jquery.com/jquery-2.1.4.js"></script>
<script src="easy.js"></script>
<link rel="stylesheet" type="text/css" href="easy.css">
</head>
<body>
<h1>Enter your full name</h1>
<input id="pass1" class="pass" placeholder="">
<button id="submit1" class="submit">Submit</button>
<div id="result1" class="result"></div>
<h1>Enter your friend's full name</h1>
<input id="pass2" class="pass" placeholder="">
<button id="submit2" class="submit">Submit</button>
<div id="result2" class="result"></div>
</body>
<script src="https://code.jquery.com/jquery-3.1.0.js"></script>
</html>
Raw
popcode.json
{"enabledLibraries":["jquery"]}
Raw
script.js
function getInitials(fullName) {
var split = fullName.split(" ");
return split[0][0] + ". " + split[1][0] + ".";
}
$("#submit1").click(function(){
var fullName = $("#pass1").val();
$("#result1").html("Your initials are: " + getInitials(fullName));
});
$("#submit2").click(function(){
var fullName = $("#pass2").val();
$("#result2").html("Your friend's initials are: " + getInitials(fullName));
});
Raw
styles.css
body {
text-align: center;
font-family: cursive;
}
.submit {
font-size: 20px;
padding: 20px;
border-radius: 20px;
font-family: cursive;
}
p {
font-size: 18px;
color: purple;
}
.pass{
width: 300px;
height: 40px;
font-size: 18px;
font-family: cursive;
}
.result{
font-size: 30px;
color:#4dffff;
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment