Skip to content

Instantly share code, notes, and snippets.

Jace wenjul

Block or report user

Report or block wenjul

Hide content and notifications from this user.

Learn more about blocking users

Contact Support about this user’s behavior.

Learn more about reporting abuse

Report abuse
View GitHub Profile
@wenjul
wenjul / dabblet.css
Created Nov 7, 2013 — forked from LeaVerou/dabblet.css
iOS 6 style switch checkboxes
View dabblet.css
/**
* 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;
}
View new_gist_file
@-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;}
View new_gist_file.css
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
wenjul / 0_reuse_code.js
Created Oct 21, 2013
Here are some things you can do with Gists in GistBox.
View 0_reuse_code.js
// Use Gists to store code you would like to remember later on
console.log(window); // log the "window" object to the console
@wenjul
wenjul / google scrollbar.css
Created Jul 1, 2013
google scrollbar style
View google scrollbar.css
::-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
wenjul / placeholder.css
Created Jun 19, 2013
兼容不支持placeholder的浏览器
View placeholder.css
.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;
}
View 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);
View 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) {
View 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) {
View 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; }
}
You can’t perform that action at this time.