Skip to content

Instantly share code, notes, and snippets.

Avatar

Chris Coyier chriscoyier

View GitHub Profile
View gist:527825
#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
View Absolute Position within Table Cells
// Plugin
$.fn.iWouldLikeToAbsolutelyPositionThingsInsideOfFrickingTableCellsPlease = function() {
var $el;
return this.each(function() {
$el = $(this);
var newDiv = $("<div />", {
"class": "innerWrapper",
"css" : {
"height" : $el.height(),
"width" : "100%",
View gist:783559
<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 != "") {
View gist:793604
<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>
View Data, WTF
$(function() {
var $el;
$("input[placeholder]").each(function() {
$el = $(this);
$el
.css("color", "#ccc")
View gist:896686
var tooFast = false;
$(window).load(function() {
tooFast = true;
});
function bindLoad() {
if (tooFast) {
$("html").addClass("loaded");
} else {
View localStorageOfForm.js
// 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);
});
View gist:945619
<?php
/*
Template Name: Comment Graph
*/
?>
<!DOCTYPE html>
<html>
<head>
<meta charset=utf-8>
View gist:958246
$.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
}
}
@chriscoyier
chriscoyier / gist:964905
Created May 10, 2011
Excellent Web People and their Personal Blogs
View gist:964905
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
You can’t perform that action at this time.