Skip to content

Instantly share code, notes, and snippets.

View stinoga's full-sized avatar

Rob stinoga

41 followers · 44 following
View GitHub Profile
@robtarr
robtarr / resize.js
Created July 9, 2012 14:51
Google Analytics Resize Tracking
(function() {
var resizeTimer;
// Assuming we have jQuery present
$( window ).on( "resize", function() {
// Use resizeTimer to throttle the resize handler
clearTimeout( resizeTimer );
resizeTimer = setTimeout(function() {
@andreasbovens
andreasbovens / viewport-meta-in-20-best-responsive-designs.md
Created July 17, 2012 15:56
Viewport meta tags used by the 20 sites that are listed in Social Driver's "20 Best Responsive Web Design Examples of 2012"

Intro

http://socialdriver.com/2012/07/20-best-responsive-websites/ lists 20 sites that are supposedly best-in-class when it comes to responsive design techniques. I had a look at the viewport meta tags used in these sites.

Findings

  • All sites use width=device-width, with in most cases an additional initial-scale=1. This is good practice.

However:

  • 8 sites turn off pinch-zooming by setting maximum-scale to 1, or using user-scalable=no. While there are some corner use cases for this, it does not make sense to do this on text-heavy sites as it impairs accessibility.
  • 3 sites use semi-colons as delimiters between viewport values. While this works in newer mobile browsers, it's not officially supported, and breaks in older mobile browser versions.
  • 1 site has 2 viewport meta tags (with different values) in the source...
@joshkurz
joshkurz / app.js
Created August 9, 2012 03:21
AngularJs-twitterBootstrap-wysiHtml5
var demoApp = angular.module('demoApp', ['ngResource'], function($locationProvider) {
$locationProvider.hashPrefix('');
});
function MainCtrl($scope, Serv) {
$scope.selectedItem = {
value: 0,
label: ''
};
$scope.Wrapper = Serv;
@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 */
@mbostock
mbostock / .block
Last active August 5, 2024 16:51 — forked from mbostock/.block
Pie Chart
license: gpl-3.0
redirect: https://beta.observablehq.com/@mbostock/d3-pie-chart
@mattratleph
mattratleph / vimdiff.md
Last active March 17, 2025 13:07 — forked from roothybrid7/vimdiff_cheet.md
vimdiff cheat sheet

vimdiff cheat sheet

##git mergetool

In the middle file (future merged file), you can navigate between conflicts with ]c and [c.

Choose which version you want to keep with :diffget //2 or :diffget //3 (the //2 and //3 are unique identifiers for the target/master copy and the merge/branch copy file names).

:diffupdate (to remove leftover spacing issues)

:only (once you’re done reviewing all conflicts, this shows only the middle/merged file)

@pfulton
pfulton / headings-helpers.css
Created February 13, 2013 21:40
Compass has a "headings" helper, but based on the docs, figuring out the syntax for it is a little difficult. Here's a quick example of the SCSS and its compiled result. This comes in handy more often than you'd think ;-)
h1, h2, h3, h4, h5, h6 {
text-transform: uppercase;
}
h1, h2, h3 {
font-family: Arial;
font-weight: bold;
margin-bottom: 0.35em;
color: #474747;
}
@adamcbrewer
adamcbrewer / webkit-css-mask.css
Created June 25, 2013 16:04
CSS: overflow/border-radius mask bug-thingy
/*
* There's a bug in Chrome/Safari using overflow:hidden with border-radius. This mask fixes it.
* Solution: http://stackoverflow.com/questions/5736503/how-to-make-css3-rounded-corners-hide-overflow-in-chrome-opera/10296258#10296258
*/
.masked {
position: absolute;
border-radius: 10px;
overflow: hidden;
/* this fixes the overflow:hidden in Chrome */
-webkit-mask-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAIAAACQd1PeAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAA5JREFUeNpiYGBgAAgwAAAEAAGbA+oJAAAAAElFTkSuQmCC);
@elefontpress
elefontpress / gist:6159651
Last active June 12, 2024 22:48
This is the contract Bearded uses for client work on a time and materials basis. It's worked for us, but I am not a lawyer, so please run it by yours before you use it! Regardless, do whatever you like with it. Use it, share it, change it ... go nuts. Our original contract from 2008 was for fixed-price projects and was based on Andy Clark'e Cont…

Bearded's Hourly Contract

Date: [[Date of Document]] Between [Our Company] and [Your Company]

Summary

We’re not big on formality, but sometimes it’s best to have a few simple things written down so that we’re all on the same page. In this contract you won’t find complicated legal terms or large passages of unreadable text. We have no desire to trick you into signing something that you might later regret. We do want what’s best for the safety of both parties, now and in the future.

@stephenscaff
stephenscaff / Load page then scroll to anchor
Last active December 22, 2015 23:49
Got a scroll-based site with more than one page, and some page anchor nav links? Nice. But, when clicking a page anchor link from another page, let's load the new page first, slow our damn rolls, then scroll down to the bad boy all sexy like. Throw in a bit of offset for a fixed nav too. Don't forget them easing equations son. They make life wor…
//Scroll to anchor on new page load
$(document).ready(function() {
//This a page anchor link?
if (window.location.hash) {
//Then, slow your roll son, load then scroll
setTimeout(function() {
$('html, body').scrollTop(0).show();
$('html, body').animate({
//how about a touch of offset, cause I'm rockin' a fixed nav
scrollTop: $(window.location.hash).offset().top-50