Skip to content
Open
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
23 changes: 12 additions & 11 deletions index.html
Original file line number Diff line number Diff line change
Expand Up @@ -6,42 +6,43 @@
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="description" content="">
<meta name="author" content="">
<link rel="stylesheet" type="text/css" href="seuss.css">
<style>
body { font-family:Arial,Helvetica; text-align: center; }
h1 { font-size:50px; }
.btn { display: inline-block; padding: 10px; background-color: #ccc; text-align: center; cursor:pointer; margin-top: 20px; }
.btn:hover { background-color:rgb(10, 179, 175); color:#fff; }
.off { cursor:default; opacity:0.5; }
.off:hover { background-color: #ccc; color:#000; }
span { display: block; font-size:10px; }


</style>
</head>
<body>
<div class="wrapper">
<div class="wrapper">
<h1>Seuss.js*</h1>
<h2>a lightweight (for now) js plugin that will transform a website into something of dr. seuss' dreams**</h2>
<h3>it's probably important that we incorporate some kind of seuss-eqs rhyming gag into this example page</h3>
<h3>it's probably important that we incorporate some kind of seuss-esque rhyming gag into this example page</h3>
<h4>well, the plugin will eventually do that. for now, it will not and somehow the world will be a sadder place.</h4>
<h5><a href="https://github.com/vagh27/seuss.js" target="_blank">check it out so far on github</a></h5>
<span>* legend has it, this exact js plugin was the good doctor's dying wish</span>
<span>** but your nightmares***</span>
<span>*** unless you're a client, then it will look totally rad</span>

</div>
<div class="runSeuss btn">runseuss</div>
<div class="unSeuss btn off">unseuss</div>

<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
<script src="seuss.js"></script>
<script>
$(function () {
var snd = new Audio("saxophone.mp3"); // buffers automatically when created
$('body').on('click','.runSeuss:not(.off)', function(){
$('.runSeuss, .unSeuss').toggleClass('off');
$('.wrapper').seuss();
$('.wrapper').seuss();
snd.play();
});
$('body').on('click','.unSeuss:not(.off)', function(){
$('.runSeuss, .unSeuss').toggleClass('off');
snd.pause();
});
});
});
</script>

</body>
</html>
Binary file added saxophone.mp3
Binary file not shown.
12 changes: 12 additions & 0 deletions seuss.css
Original file line number Diff line number Diff line change
@@ -0,0 +1,12 @@
body { font-family:Arial,Helvetica; text-align: center; }
h1 { font-size:50px; }
.btn { display: inline-block; padding: 10px; background-color: #ccc; text-align: center; cursor:pointer; margin-top: 20px; }
.btn:hover { background-color:rgb(10, 179, 175); color:#fff; }
.off { cursor:default; opacity:0.5; }
.off:hover { background-color: #ccc; color:#000; }
span { display: block; font-size:10px; }

.hover
{
opacity: .5;
}
15 changes: 12 additions & 3 deletions seuss.js

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.