Created
February 18, 2016 18:26
-
-
Save mikemfleming/c2eddacb35545ea1e767 to your computer and use it in GitHub Desktop.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<!DOCTYPE html> | |
<head> | |
<title>Clicking Page</title> | |
<style type="text/css"> | |
.invertMe{ | |
} | |
.centered{ | |
text-align:center; | |
} | |
.hexText{ | |
font: bold 20px "Open Sans", Sans-serif; | |
} | |
.text{ | |
font: bold 200px "Open Sans", Sans-serif; | |
} | |
.noHighlight{ | |
-webkit-user-select: none; | |
-mox-user-select: none; | |
-ms-user-select: none; | |
user-select: none; | |
} | |
</style> | |
</head> | |
<body> | |
<div class="centered text invertMe target noHighlight">CLICK HERE TO PARTY</div> | |
<div class="centered hexDisplay invertMe hexText"></div> | |
<script src="https://code.jquery.com/jquery-2.1.1.js"></script> | |
<script> | |
$('.target').click(function(){ | |
var randomColor = "#000000".replace(/0/g,function(){return (~~(Math.random()*16)).toString(16);}); | |
var compColor = "#000000".replace(/0/g,function(){return (~~(Math.random()*16)).toString(16);}) | |
$('body').css('background-color',randomColor); | |
$('.hexDisplay').html((randomColor.toUpperCase()) + ' : ' + (compColor.toUpperCase())); | |
$('.invertMe').css('color', compColor) | |
console.log("This is the background hex color: " + randomColor); | |
console.log("This is the text color: " + compColor); | |
}) | |
/*$('.invertMe').click(function(randomColor){ | |
var compColor; | |
compColor = 0xffffff - | |
})*/ | |
</script> | |
</body> | |
</html> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
This is a time capsule from when I was first learning JavaScript. Judgment free zone!