Skip to content

Instantly share code, notes, and snippets.

View IanLunn's full-sized avatar

Ian Lunn IanLunn

View GitHub Profile
@IanLunn
IanLunn / gist:5468127
Created April 26, 2013 15:28
A function that will take a transition-timing-function from an element and return it as a cubic-bezier() function should it not be one. This is needed because WebKit currently returns the transition-timing-function property as a keyword (such as "linear"), whereas other browsers will return the cubic-bezier(). If a browser returns a cubic-bezier…
var element = document.getElementById('transition'); //get the element you want the timing-function of
var style = element.currentStyle || window.getComputedStyle(element, null); //get the styles for that element
var timingFunction = style.transitionTimingFunction; //specifically select the transitionTimingFunction from the styles
function convertTimingFunctionToCubicBezier(timingFunction) {
var timingFunctionToCubicBezier = {
@IanLunn
IanLunn / gist:4666512
Created January 29, 2013 18:41
Reverse a two-point cubic bezier
/* sample cubic beziers */
linear = [0.250, 0.250, 0.750, 0.750];
ease = [0.250, 0.100, 0.250, 1.000];
easeIn = [0.420, 0.000, 1.000, 1.000];
easeOut = [0.000, 0.000, 0.580, 1.000];
easeInOut = [0.420, 0.000, 0.580, 1.000];
function reverseCubicBezier(cubicBezier) {
return [
1 - cubicBezier[2],
@IanLunn
IanLunn / gist:3679971
Created September 8, 2012 21:40
Cross Browser jQuery Image Load()
$(imagesToPreload).each(function(){
var imgSrc = $(this).attr("src"); //get the image src so it can be put back in to convince IE to run the .load() function correctly
$(this).load(function(){
//do something as the images are loaded (eg, count them to make sure they're all loaded then run a callback)
}).attr("src", imgSrc); //makes .load() work in IE when images are cached
});
@IanLunn
IanLunn / index.html
Created June 20, 2012 14:58
Transform Origin Indicator
<div class="transform origin">
Element to be transformed
</div>