Skip to content

Instantly share code, notes, and snippets.

View robtarr's full-sized avatar

Rob Tarr robtarr

85 followers · 17 following
View GitHub Profile
@robtarr
robtarr / buildPicker.js
Created September 7, 2011 04:28
Canvas Color Picker
var app = {};
app.$colors = $('canvas.color-palette');
app.colorctx = app.$colors[0].getContext('2d');
// Build Color palette
app.buildColorPalette = function() {
var gradient = app.colorctx.createLinearGradient(0, 0, app.$colors.width(), 0);
// Create color gradient
@robtarr
robtarr / inputs.html
Created February 2, 2012 02:27
Number Input Tests
<!doctype html>
<html>
<head>
<title>Number Test</title>
<style>
tr {
background: #ddd;
}
tr:nth-child(odd) {
@robtarr
robtarr / css
Created March 24, 2012 04:21
Responsive Navigation with Javascript
ul {
list-style: none;
}
li {
float: left;
margin-right: 20px;
}
.secondary-menu {
display: none;
@robtarr
robtarr / js
Created March 26, 2012 14:01
mediaCheck.js
var mediaCheck = function(options) {
var mq,
matchMedia = window.matchMedia !== undefined;
if (matchMedia) {
mqChange = function(mq, options) {
if (mq.matches) {
options.entry();
} else {
options.exit();
@robtarr
robtarr / fiddle.css
Created May 7, 2012 14:32
Form Validation and jQueryUI Datepicker
.valid {
background: green;
color: #fff;
}
.error {
background: red;
color: #fff;
}
@robtarr
robtarr / fiddle.css
Created May 7, 2012 15:08
Form Validation with H5F and jQueryUI Datepicker
.valid {
background: green;
color: #fff;
}
.error {
background: red;
color: #fff;
}
​
@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() {
@robtarr
robtarr / mixins.scss
Created August 20, 2012 18:13
Retina/HD SASS mix-in
@mixin hd($path, $img) {
@media (-webkit-max-device-pixel-ratio: 1.49),
(-o-max-device-pixel-ratio: 3/2.01),
(max-device-pixel-ratio: 1.49) {
background-image: url($path + "/" + $img);
}
@media (-webkit-min-device-pixel-ratio: 1.5),
(-o-min-device-pixel-ratio: 3/2),
@robtarr
robtarr / _mixins.scss
Created August 24, 2012 19:41
SCSS mixin for REMs (done with jondaiello)
@mixin rem-width( $em-size ) {
width: $em-size * $base-font-multiplier * 16px;
width: $em-size * 1rem;
}
@robtarr
robtarr / group.css
Created September 7, 2012 13:33
SASS Grouping function
.elementA:before,
.elementB:before,
.elementA:after,
.elementB:after { content: ""; display: table; }
.elementA:after
.elementB:after { clear: both; }
.elementA,
.elementB { *zoom: 1; }