Jace wenjul
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| /** | |
| * 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; | |
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| /** | |
| * 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
/ dabblet.css
Created
November 7, 2013 15:30
— forked from LeaVerou/dabblet.css
iOS 6 style switch checkboxes
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| /** | |
| * 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/
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| @-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
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| 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.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| // Use Gists to store code you would like to remember later on | |
| console.log(window); // log the "window" object to the console |
wenjul
/ styles.css
Created
December 22, 2015 06:43
— forked from pburtchaell/styles.css
VH and VW units can cause issues on iOS devices. To overcome this, create media queries that target the width, height, and orientation of iOS devices.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| /** | |
| * VH and VW units can cause issues on iOS devices: http://caniuse.com/#feat=viewport-units | |
| * | |
| * To overcome this, create media queries that target the width, height, and orientation of iOS devices. | |
| * It isn't optimal, but there is really no other way to solve the problem. In this example, I am fixing | |
| * the height of element `.foo` —which is a full width and height cover image. | |
| * | |
| * iOS Resolution Quick Reference: http://www.iosres.com/ | |
| */ | |
wenjul
/ rem.js
Created
December 21, 2015 11:27
— forked from fwon/rem.js
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| /* | |
| * rem.js | |
| * v0.1.1 | |
| * fixed 2015-3-12 | |
| */ | |
| (function (win){ | |
| var doc = win.document, | |
| html = doc.documentElement, | |
| option = html.getAttribute('data-use-rem'); | |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| .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
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| (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); |