wenjul’s gists

wenjul / dabblet.css

Created November 7, 2013 15:30 — forked from LeaVerou/dabblet.css

iOS 6 style switch checkboxes

	/**
	* iOS 6 style switch checkboxes
	* by Lea Verou http://lea.verou.me
	*/

	:root input[type="checkbox"] { /* :root here acting as a filter for older browsers */
	position: absolute;
	opacity: 0;
	}

wenjul / new_gist_file

Created October 23, 2013 02:39

From http://www.cssreset.com/css3-keyframe-animations-iphone-wiggle-effect/

@-webkit-keyframes wiggle {    from {-webkit-transform: rotateZ(2deg);}    50% {-webkit-transform: rotateZ(-2deg);}    to {-webkit-transform: rotateZ(2deg);}} .productBox {    -webkit-animation-name: wiggle;    -webkit-animation-duration: .4s;    -webkit-animation-iteration-count: infinite;    -webkit-animation-timing-function: ease;}

wenjul / new_gist_file.css

Created October 21, 2013 15:19

From http://www.html5rocks.com/en/tutorials/masking/adobe/?redirect_from_locale=zh

	img:hover {
	clip-path: polygon(0px 208px, 146.5px 207px, 147px 141.2px, ...);
	animate: star 3s;
	}

	@keyframes star {
	0% {
	clip-path: polygon(0px 208px, 146.5px 207px, 147px 141.2px, ...);
	},
	100% {

wenjul / 0_reuse_code.js

Created October 21, 2013 13:42

Here are some things you can do with Gists in GistBox.

	// Use Gists to store code you would like to remember later on
	console.log(window); // log the "window" object to the console

wenjul / google scrollbar.css

Created July 1, 2013 07:35

google scrollbar style

	::-webkit-scrollbar{height:16px; width:16px;}
	::-webkit-scrollbar-button{height:0; width:0;}
	::-webkit-scrollbar-button:start:decrement,
	::-webkit-scrollbar-button:end:increment{display:block;}
	::-webkit-scrollbar-button:vertical:start:increment,
	::-webkit-scrollbar-button:vertical:end:decrement{display:none;}
	::-webkit-scrollbar-track:vertical,
	::-webkit-scrollbar-track:horizontal,
	::-webkit-scrollbar-thumb:vertical,
	::-webkit-scrollbar-thumb:horizontal{border-style:solid; border-color:transparent;}

wenjul / placeholder.css

Created June 19, 2013 11:10

兼容不支持placeholder的浏览器

	.placeholder{color:#A2A2A2;}
	::-webkit-input-placeholder { /* WebKit browsers */
	color:#A2A2A2;
	}
	:-moz-placeholder { /* Mozilla Firefox 4 to 18 */
	color:#A2A2A2;
	}
	::-moz-placeholder { /* Mozilla Firefox 19+ */
	color:#A2A2A2;
	}

wenjul / SideScroller.js

Created May 18, 2013 16:48 — forked from yramagicman/SideScroller.js

	(function() {
	var divs = $('.page'),
	$next = $('.next'),
	$prev = $('.prev'),
	that = this,
	loc, page;
	for (var i = divs.length - 1; i >= 0; i--) {
	var z = i + 1;
	divs[i].style.left = i * 100 + '%';
	divs[i].id = 'page-' + (i + 1);

wenjul / css-responsive-images.html

Created May 7, 2013 10:47 — forked from necolas/css-responsive-images.html

	<!DOCTYPE html>
	<html>
	<head>
	<meta charset="utf-8">
	<title>CSS responsive images</title>
	<style>
	/* Doesn't stop original source image being
	downloaded too */

	@media (min-device-width:600px) {

wenjul / rAF.js

Created March 6, 2013 07:55 — forked from paulirish/rAF.js

	// http://paulirish.com/2011/requestanimationframe-for-smart-animating/
	// http://my.opera.com/emoller/blog/2011/12/20/requestanimationframe-for-smart-er-animating

	// requestAnimationFrame polyfill by Erik Möller
	// fixes from Paul Irish and Tino Zijdel

	(function() {
	var lastTime = 0;
	var vendors = ['ms', 'moz', 'webkit', 'o'];
	for(var x = 0; x < vendors.length && !window.requestAnimationFrame; ++x) {

wenjul / ie10hack.css

Created February 27, 2013 03:19 — forked from atk/ie10hack.css

	/*
	#ie10 will only be red in MSIE 10,
	both in high contrast (display setting) and default mode
	*/

	@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
	#ie10 { color: red; }
	}

Jace wenjul