Skip to content

Instantly share code, notes, and snippets.

View davidhund's full-sized avatar

David Hund davidhund

82 followers · 38 following
View GitHub Profile
@andrewrocco
andrewrocco / check.html
Created April 24, 2012 17:55
CSS Media Check
<!doctype html>
<html>
<head>
<title>CSS Media Check</title>
<style type="text/css">
#mediaquery{
-webkit-transition: width .001s;
-moz-transition: width .001s;
@smeranda
smeranda / facebook_like-box_responsive.css
Created May 1, 2012 20:37
Flexible width layout for Facebook Like Box/Activity Stream to use in Responsive Designs
/*
Make the Facebook Like box responsive (fluid width)
https://developers.facebook.com/docs/reference/plugins/like-box/
*/
/* This element holds injected scripts inside iframes that in some cases may stretch layouts. So, we're just hiding it. */
#fb-root {
display: none;
}
@jonathanmoore
jonathanmoore / gist:2640302
Created May 8, 2012 23:17
Get the share counts from various APIs

Share Counts

I have always struggled with getting all the various share buttons from Facebook, Twitter, Google Plus, Pinterest, etc to align correctly and to not look like a tacky explosion of buttons. Seeing a number of sites rolling their own share buttons with counts, for example The Next Web I decided to look into the various APIs on how to simply return the share count.

If you want to roll up all of these into a single jQuery plugin check out Sharrre

Many of these API calls and methods are undocumented, so anticipate that they will change in the future. Also, if you are planning on rolling these out across a site I would recommend creating a simple endpoint that periodically caches results from all of the APIs so that you are not overloading the services will requests.

Twitter

@jonathantneal
jonathantneal / querySelectorForIE.js
Created May 23, 2012 21:55
Query Selector for IE
!('querySelectorAll' in document) && ('contains' in document.documentElement) && (function (window, document) {
var
documentHead = document.getElementsByTagName('head')[0],
querySelectorElement = document.createElement('style'),
querySelectorPrototypeElement = document.createElement('style');
documentHead.insertBefore(querySelectorElement , documentHead.firstChild);
documentHead.insertBefore(querySelectorPrototypeElement, documentHead.firstChild);
function querySelectorAll(selector) {
@designermonkey
designermonkey / zen_settings.py
Created May 29, 2012 15:18
Updated Zen Settings for XSL
"""
Zen Coding settings
@author Sergey Chikuyonok ([email protected])
@link http://chikuyonok.ru
"""
zen_settings = {
# Variables that can be placed inside snippets or abbreviations as ${variable}
# ${child} variable is reserved, don't use it
'variables': {
@eirikbacker
eirikbacker / addEventListener-polyfill.js
Created June 3, 2012 19:30
addEventListener polyfill for IE6+
//addEventListener polyfill 1.0 / Eirik Backer / MIT Licence
(function(win, doc){
if(win.addEventListener)return; //No need to polyfill
function docHijack(p){var old = doc[p];doc[p] = function(v){return addListen(old(v))}}
function addEvent(on, fn, self){
return (self = this).attachEvent('on' + on, function(e){
var e = e || win.event;
e.preventDefault = e.preventDefault || function(){e.returnValue = false}
e.stopPropagation = e.stopPropagation || function(){e.cancelBubble = true}
@simX
simX / hidpi.txt
Created July 28, 2012 04:58
Enable HiDPI mode in Mountain Lion w/o Quartz Debug
sudo defaults write /Library/Preferences/com.apple.windowserver DisplayResolutionEnabled -bool YES;
sudo defaults delete /Library/Preferences/com.apple.windowserver DisplayResolutionDisabled;
// by the way, you need to logout and log back in for this to take effect. Or at least that's what
// Quartz Debug says. Who knows, maybe it's lying?
// P.S. Go to [Apple menu --> System Preferences --> Displays --> Display --> Scaled] after logging
// back in, and you'll see a bunch of "HiDPI" resolutions in the list to choose from.
@adactio
adactio / placeholderFromDatalist.js
Created August 12, 2012 15:54
Generate a placeholder attribute from the datalist associated with that input.
(function(win,doc) {
if (doc.querySelectorAll) {
var inputs = doc.querySelectorAll('input[list]'),
total = inputs.length;
for (var i=0; i<total; i++) {
var input = inputs[i],
id = input.getAttribute('list'),
list = doc.getElementById(id),
options = list.getElementsByTagName('option'),
amount = options.length,
@marcedwards
marcedwards / high-dpi-media.css
Last active March 2, 2025 20:24
A CSS media query that captures almost all high DPI aware devices.
/* ---------------------------------------------------------- */
/* */
/* A media query that captures: */
/* */
/* - Retina iOS devices */
/* - Retina Macs running Safari */
/* - High DPI Windows PCs running IE 8 and above */
/* - Low DPI Windows PCs running IE, zoomed in */
/* - Low DPI Windows PCs and Macs running Firefox, zoomed in */
/* - Android hdpi devices and above */
@chriscoyier
chriscoyier / mq.css
Created October 3, 2012 18:24
@media only screen and (min-width: 320px) {
/* Small screen, non-retina */
}
@media
only screen and (-webkit-min-device-pixel-ratio: 2) and (min-width: 320px),
only screen and ( min--moz-device-pixel-ratio: 2) and (min-width: 320px),
only screen and ( -o-min-device-pixel-ratio: 2/1) and (min-width: 320px),