Chris Coyier chriscoyier
chriscoyier
/ gist:527825
Created
August 16, 2010 21:55
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
| #things-i-do { width: 370px; position: absolute; right: 0; top: 0; } | |
| .thing-i-do { text-align: center; margin: 18px; background: rgba(215, 215, 215, 0.5); border: 1px solid #ccc; height: 65px; overflow: hidden; } | |
| .thing-i-do a { display: block; height: 130px; } | |
| .thing-i-do h5 { border: 0; color: #333; height: 65px; line-height: 65px; opacity: 1; text-transform: inherit; letter-spacing: 0; font-style: italic; -webkit-transition: all 0.2s linear; -moz-transition: all 0.2s linear; } | |
| .thing-i-do a:hover h5 { margin-top: -75px; opacity: 0; } | |
| .thing-i-do div { position: relative; background: #333; color: white; height: 65px; padding: 10px; font-size: 11px; opacity: 0.0; -webkit-transform: rotate(6deg); -webkit-transition: all 0.4s linear; -moz-transform: rotate(6deg); -moz-transition: all 0.4s linear; } | |
| .thing-i-do a:hover div { opacity: 1; -webkit-transform: rotate(0deg); -moz-transform: rotate(0deg); } | |
| #thing-wufoo { background: #c73b1b url(images/css-tricks.png) 0 -1042px no-repeat; padding-left: 120px; text-ali |
chriscoyier
/ Absolute Position within Table Cells
Created
January 4, 2011 18:11
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
| // Plugin | |
| $.fn.iWouldLikeToAbsolutelyPositionThingsInsideOfFrickingTableCellsPlease = function() { | |
| var $el; | |
| return this.each(function() { | |
| $el = $(this); | |
| var newDiv = $("<div />", { | |
| "class": "innerWrapper", | |
| "css" : { | |
| "height" : $el.height(), | |
| "width" : "100%", |
chriscoyier
/ gist:783559
Created
January 17, 2011 21:53
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
| <script> | |
| function processEntries(data) { | |
| // Loop for each entry | |
| $.each(data.Entries, function(entriesIndex, entriesObject) { | |
| // Field3 is the email field on this particular form | |
| if (entriesObject.Field3 != "") { |
chriscoyier
/ gist:793604
Created
January 24, 2011 17:52
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
| <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js"></script> | |
| <script src="http://ajax.microsoft.com/ajax/jquery.templates/beta1/jquery.tmpl.min.js"></script> | |
| <script src='/examples/gravatar-party-list/js/jquery.wufooapi.js'></script> | |
| <script src='/examples/gravatar-party-list/js/md5.js'></script> | |
| <script id="attendeeTemplate" type="text/x-jquery-tmpl"> | |
| <li> | |
| <img src="http://www.gravatar.com/avatar/${MD5(Field3)}" alt="" /> | |
| <h4>${Field1} ${Field2}</h4> | |
| <a href="http://twitter.com/${Field6}">@${Field6}</a> |
chriscoyier
/ Data, WTF
Created
March 10, 2011 14:57
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
| $(function() { | |
| var $el; | |
| $("input[placeholder]").each(function() { | |
| $el = $(this); | |
| $el | |
| .css("color", "#ccc") |
chriscoyier
/ gist:896686
Created
March 31, 2011 16:22
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
| var tooFast = false; | |
| $(window).load(function() { | |
| tooFast = true; | |
| }); | |
| function bindLoad() { | |
| if (tooFast) { | |
| $("html").addClass("loaded"); | |
| } else { |
chriscoyier
/ localStorageOfForm.js
Created
April 13, 2011 17:17
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
| // Save all data, on some kind of event | |
| localStorage.setItem("doesHaveData", "yeahBaby"); | |
| var data = $("#contest-vote").serializeArray(); | |
| jQuery.each(data, function(i, obj) { | |
| localStorage.setItem(obj.name, obj.value); | |
| }); | |
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
| <?php | |
| /* | |
| Template Name: Comment Graph | |
| */ | |
| ?> | |
| <!DOCTYPE html> | |
| <html> | |
| <head> | |
| <meta charset=utf-8> |
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
| $.ajax({ | |
| url: url, | |
| dataType: 'json', | |
| data: data, | |
| success: function() { | |
| // NOW call the function again, but make sure at least XX seconds have gone by somehow | |
| } | |
| } |
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
| Yaron Schoen | |
| http://yaronschoen.com/ | |
| http://www.yaronschoen.com/site/atom/ | |
| Oli Studholme | |
| http://oli.jp/ | |
| http://oli.jp/articles.atom | |
| Ben Bleikamp | |
| http://www.bleikamp.com |
OlderNewer