Skip to content

Instantly share code, notes, and snippets.

@jlord
Created January 26, 2012 07:20
Show Gist options
  • Save jlord/1681495 to your computer and use it in GitHub Desktop.
Save jlord/1681495 to your computer and use it in GitHub Desktop.
awesome neon party
<html>
<script src="http://code.jquery.com/jquery-1.7.1.min.js" type="text/javascript"></script>
<script type="text/javascript">
function randomColor() {
var sick_neon_colors = ["#CB3301", "#FF0066", "#FF6666", "#FEFF99", "#FFFF67", "#CCFF66", "#99FE00", "#EC8EED", "#FF99CB", "#FE349A", "#CC99FE", "#6599FF", "#03CDFF"];
return sick_neon_colors[Math.floor(Math.random()*sick_neon_colors.length)];
};
function getAntiques(cb) {
var antiques = []
$.getJSON('http://data.ic.ht/dcd30b2fac72cc0e4849514a8237007f11/_all_docs?include_docs=true&limit=100&callback=?').then(function(data) {
$.each(data.rows, function(i, row) {
if(row.doc.Title) antiques.push(row.doc)
})
cb(antiques)
})
}
function changeAwesome() {
$('.awesome').css('background-color', randomColor())
}
$(function() {
getAntiques(function(antiques) {
$('.awesome').each(function(i, div) {
$(div).html('<a href="' + antiques[i].Link + '">' + antiques[i].Title + "</a>")
})
})
$('.awesome').hover(changeAwesome, changeAwesome)
})
</script>
<style type="text/css">
.awesome { width: 100; height: 100; float: left; margin: 0 auto; background-color: salmon; text-align: center }
.awesome:hover, .a:hover { cursor: pointer; cursor: hand; border-radius: 999px}
</style>
<body>
<div class="awesome"></div>
<div class="awesome"></div>
<div class="awesome"></div>
<div class="awesome"></div>
<div class="awesome"></div>
<div class="awesome"></div>
<div class="awesome"></div>
<div class="awesome"></div>
<div class="awesome"></div>
<div class="awesome"></div>
<div class="awesome"></div>
<div class="awesome"></div>
<div class="awesome"></div>
<div class="awesome"></div>
<div class="awesome"></div>
<div class="awesome"></div>
<div class="awesome"></div>
<div class="awesome"></div>
<div class="awesome"></div>
<div class="awesome"></div>
<div class="awesome"></div>
<div class="awesome"></div>
<div class="awesome"></div>
<div class="awesome"></div>
<div class="awesome"></div>
<div class="awesome"></div>
<div class="awesome"></div>
<div class="awesome"></div>
<div class="awesome"></div>
<div class="awesome"></div>
<div class="awesome"></div>
<div class="awesome"></div>
<div class="awesome"></div>
<div class="awesome"></div>
<div class="awesome"></div>
<div class="awesome"></div>
<div class="awesome"></div>
<div class="awesome"></div>
<div class="awesome"></div>
<div class="awesome"></div>
<div class="awesome"></div>
<div class="awesome"></div>
<div class="awesome"></div>
<div class="awesome"></div>
<div class="awesome"></div>
<div class="awesome"></div>
<div class="awesome"></div>
<div class="awesome"></div>
<div class="awesome"></div>
<div class="awesome"></div>
<div class="awesome"></div>
<div class="awesome"></div>
<div class="awesome"></div>
<div class="awesome"></div>
<div class="awesome"></div>
<div class="awesome"></div>
<div class="awesome"></div>
<div class="awesome"></div>
<div class="awesome"></div>
<div class="awesome"></div>
<div class="awesome"></div>
<div class="awesome"></div>
<div class="awesome"></div>
<div class="awesome"></div>
<div class="awesome"></div>
<div class="awesome"></div>
<div class="awesome"></div>
<div class="awesome"></div>
<div class="awesome"></div>
<div class="awesome"></div>
<div class="awesome"></div>
<div class="awesome"></div>
<div class="awesome"></div>
<div class="awesome"></div>
<div class="awesome"></div>
<div class="awesome"></div>
<div class="awesome"></div>
<div class="awesome"></div>
<div class="awesome"></div>
<div class="awesome"></div>
<div class="awesome"></div>
<div class="awesome"></div>
<div class="awesome"></div>
<div class="awesome"></div>
<div class="awesome"></div>
<div class="awesome"></div>
<div class="awesome"></div>
<div class="awesome"></div>
<div class="awesome"></div>
<div class="awesome"></div>
<div class="awesome"></div>
<div class="awesome"></div>
<div class="awesome"></div>
<div class="awesome"></div>
<div class="awesome"></div>
<div class="awesome"></div>
<div class="awesome"></div>
<div class="awesome"></div>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment