jQuery Stick ‘em

jQuery plugin to mimic the new and upcoming CSS position: sticky; position: sticky is a new way to position elements and is conceptually similar to position: fixed. The difference is that an element with position: sticky behaves like position: relative within its parent, until a given offset threshold is met in the viewport. jQuery Stick’em …

CSS image-set in Webkit (Safari/Chrome)

Safari 6 and Chrome 21 added vendor-prefixed support for the proposed CSS4 image-set specification. This proposed specification is designed to support displays with different pixel densities (read: retina displays). background-image: url(image.jpg); background-image: -webkit-image-set(url(image.jpg) 1x, url(image@2x.jpg) 2x); /* Also include other prefixed versions of this … */ background-image: image-set(url(image.jpg) 1x, url(image@2x.jpg) 2x); Safari 6 and Chrome …

Meny — An experimental CSS 3D fold-in menu

A UI experiment with a 3D fold-in menu. Move your mouse to the left edge of this page — or swipe in from the left edge if you’re on a touch device — to expand the menu. A refreshing alternative to the already overly common left nav flyout which Facebook introduced in their mobile app. …

jQuery Transit

jQuery Transit is a plugin for to help you do CSS transformations and transitions in jQuery. Include the plugin and you can use code like this to perform transformations: $(“#box”).css({ x: ’30px’ }); // Move right $(“#box”).css({ y: ’60px’ }); // Move down $(“#box”).css({ translate: [60,30] }); // Move right and down $(“#box”).css({ rotate: ’30deg’ …

Vendor Prefix Drama

Grab a bucket of popcorn and start reading. “YHWH” clearly doesn’t get it (UA sniffing, only prefixed properties, inline JS, …) Hundreds of pages in our 16 plus domains DO NOT fade images on mouseover anymore, because the -moz-opacity:0.7 reading function is GONE. Seems like he’s also forgetting the fact it only works used to …