Skip to content

Instantly share code, notes, and snippets.

View davidyeiser's full-sized avatar

David Yeiser davidyeiser

View GitHub Profile
@davidyeiser
davidyeiser / text-explosion-sample.html
Created March 8, 2011 06:01
The sample HTML used for the text explosion demo.
<form class="email-signup">
<label id="email-signup-label">Sign-up for news, special offers &amp; beta invites.</label>
<input type="text" />
</form>
@davidyeiser
davidyeiser / jquery-text-explosion.js
Created March 8, 2011 05:39
Associated jQuery for text explosion. As seen on http://gopotluck.com/
$(function() {
$("#email-signup-label").lettering();
var is_search_empty = $(".email-signup input").attr("value");
if (!is_search_empty == "") {
$("#email-signup-label").css({opacity:0});
}
$("#email-signup-label").click(function() {
$(".email-signup input").focus();
/*
STUFF'S GONNA 'SPLODE
---------------------
The following CSS enables the exploding effect on the input label.
(Only seen on modern browsers.)
Context: http://gopotluck.com/
Related tutorial: http://designintellection.com/lab/exploding-text/
*/