Very neat 3D presentation of an iPad, with realistic lighting effect. Apple should to this on their site. CSS3 Lighting Effects →
Tag Archives: css
Responsive CSS3 Slider
With clever use of the general sibling selector: #slide1:checked ~ #slides .inner { margin-left:0; } #slide2:checked ~ #slides .inner { margin-left:-100%; } #slide3:checked ~ #slides .inner { margin-left:-200%; } #slide4:checked ~ #slides .inner { margin-left:-300%; } #slide5:checked ~ #slides .inner { margin-left:-400%; } Responsive CSS3 Slider →
Clearless — A collection of reusable LESS mixins
Cleverly animating accordions
3D Restaurant Menu
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 …
FoldScroll
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([email protected]) 2x); /* Also include other prefixed versions of this … */ background-image: image-set(url(image.jpg) 1x, url([email protected]) 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. …
Continue reading “Meny — An experimental CSS 3D fold-in menu”