Skip to content

Instantly share code, notes, and snippets.

View tsvensen's full-sized avatar

Tim Svensen tsvensen

49 followers · 9 following
View GitHub Profile
@tsvensen
tsvensen / getQueryParameters
Last active August 29, 2015 13:56
Get Query Params
// Plugin to get query params as an object
jQuery.extend({
getQueryParameters : function(str) {
return (str || document.location.search).replace(/(^\?)/,'').split("&").map(function(n){return n = n.split("="),this[n[0]] = n[1],this}.bind({}))[0];
}
});
// EXAMPLE
// http://codepen.io/chriscoyier/pen/uszCr?lunch=sandwich&dinner=stirfry
var queryParams = $.getQueryParameters();
@tsvensen
tsvensen / gist:4efedfe486ecbc4d3345
Created September 5, 2014 22:02
jQuery Element Caching System
// Requires underscore or lodash for isUndefined()
var $cache = {};
/**
* Returns the page title element and will set the page title element when it doesn't exist
* @param {String} selector
* @returns {jQuery}
*/
getElement: function getElement(selector) {
if (typeof selector !== 'string') {
@tsvensen
tsvensen / mobile-iframe_or_facebook-detect
Created March 7, 2012 06:06
Test for a mobile browser based on user agent and when the site is not within an iframe (facebook), then redirect.
/**
* When !mobile and !facebook then redirect to facebook app/tab
* javascript mobile browser detect from http://detectmobilebrowsers.com/ (modified below)
* Regex updated: 28 February 2012
*/
(function(a,window,url){
ismobile = /android.+mobile|avantgo|bada\/|blackberry|blazer|compal|elaine|fennec|hiptop|iemobile|ip(hone|od)|iris|kindle|lge |maemo|midp|mmp|netfront|opera m(ob|in)i|palm( os)?|phone|p(ixi|re)\/|plucker|pocket|psp|symbian|treo|up\.(browser|link)|vodafone|wap|windows (ce|phone)|xda|xiino/i.test(a)||/1207|6310|6590|3gso|4thp|50[1-6]i|770s|802s|a wa|abac|ac(er|oo|s\-)|ai(ko|rn)|al(av|ca|co)|amoi|an(ex|ny|yw)|aptu|ar(ch|go)|as(te|us)|attw|au(di|\-m|r |s )|avan|be(ck|ll|nq)|bi(lb|rd)|bl(ac|az)|br(e|v)w|bumb|bw\-(n|u)|c55\/|capi|ccwa|cdm\-|cell|chtm|cldc|cmd\-|co(mp|nd)|craw|da(it|ll|ng)|dbte|dc\-s|devi|dica|dmob|do(c|p)o|ds(12|\-d)|el(49|ai)|em(l2|ul)|er(ic|k0)|esl8|ez([4-7]0|os|wa|ze)|fetc|fly(\-|_)|g1 u|g560|gene|gf\-5|g\-mo|go(\.w|od)|gr(ad|un)|haie|hcit|hd\-(m|p|t)|hei\-|hi(pt|ta)|hp(
@tsvensen
tsvensen / jquery-scrollto
Created March 12, 2012 16:50
jQuery ScrollTo
// ScrollTo top of an element
$('html, body').animate({scrollTop: $('#my-element').offset().top}, 600, 'linear');
// ScrollTo and center the element
$('html, body').animate({
scrollTop: parseInt($('#my-element').offset().top) - ($(window).height() / 2) + ($('#my-element').height() / 2),
scrollLeft: parseInt($('#my-element').offset().left) - ($(window).width() / 2) + ($('#my-element').width() / 2)
}, 600, 'linear');
@tsvensen
tsvensen / gist:2829402
Created May 29, 2012 16:30 — forked from cvuletich/gist:2829385
CSS3 Ring Pulsers
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title>Ring Pulsers</title>
<style type="text/css" media="screen">
.marker {
left: 150px;
height: 100px;
position: absolute;
@tsvensen
tsvensen / MediaQueries+ESRG.scss
Last active December 16, 2015 17:59
Using Media Queries in Sass with ESRG's Sass Grid Generator (https://github.com/dfcb/extra-strength-responsive-grids)
// Using media queries in Sass with ESRG Grid Generator (https://github.com/dfcb/extra-strength-responsive-grids)
@import 'grid.generator.scss' // (https://github.com/dfcb/extra-strength-responsive-grids/blob/master/css/_grid.generator.scss)
// Media query mixin used below (should live in another file)
@mixin mq($media_query) {
@media ($media_query) { @content; }
}
@tsvensen
tsvensen / fixed-and-fluid-ratios.css
Last active December 16, 2015 20:10
Fixed and Fluid Ratios
/**
* FIXED and FLUID RATIOs
* http://voormedia.com/blog/2012/11/responsive-background-images-with-fixed-or-fluid-aspect-ratios
*/
/**
* FIXED RATIO
<div class="column">
<figure class="fixedratio"></figure>
@tsvensen
tsvensen / browser-notepad
Created May 1, 2013 16:45
Transform your browser into a notepad, paste in URL bar:
data:text/html,<html contenteditable>
@tsvensen
tsvensen / get-multiplier.sass
Last active December 17, 2015 00:10
get-multiplier() & strip-units() bonus. For setting line-height and EM values, specifically for vertical rhythms. This is different from the px to em functions out there.
// strip-units()
// Remove units from a Sass value with units (em, px, etc.)
// http://stackoverflow.com/questions/12328259/how-do-you-strip-the-unit-from-any-number-in-sass#answer-12335841
// EXAMPLE
// strip-units($my-var);
@function strip-units($number) {
@return $number / ($number * 0 + 1);
}
@tsvensen
tsvensen / image-replacement.css
Last active December 23, 2019 11:46
Image Replacement Technique
/* http://www.zeldman.com/2012/03/01/replacing-the-9999px-hack-new-image-replacement/ */
overflow: hidden;
text-indent: 100%;
white-space: nowrap;