(by @andrestaltz)
If you prefer to watch video tutorials with live-coding, then check out this series I recorded with the same contents as in this article: Egghead.io - Introduction to Reactive Programming.
/* modernizr-test.js | |
* Daniel Ott | |
* 3 March 2011 | |
* Custom Tests using Modernizr's addTest API | |
*/ | |
/* iOS | |
* There may be times when we need a quick way to reference whether iOS is in play or not. | |
* While a primative means, will be helpful for that. | |
*/ |
@function em($target, $context: $base-font-size) { | |
@if $target == 0 { @return 0 } | |
@return $target / $context + 0em; | |
} | |
$base-font-size: 15px; | |
h1 { | |
font-size: em(21px, 15px); // Outputs 1.4em | |
} |
@-webkit-keyframes bgcolor { 0% { background-color: #ffccf2; } | |
50% { background-color: #ccffcc; } | |
100% { background-color: #ccffff; } } | |
@-moz-keyframes bgcolor { 0% { background-color: #ffccf2; } | |
50% { background-color: #ccffcc; } | |
100% { background-color: #ccffff; } } | |
@-ms-keyframes bgcolor { 0% { background-color: #ffccf2; } | |
50% { background-color: #ccffcc; } |
(by @andrestaltz)
If you prefer to watch video tutorials with live-coding, then check out this series I recorded with the same contents as in this article: Egghead.io - Introduction to Reactive Programming.
All of the below properties or methods, when requested/called in JavaScript, will trigger the browser to synchronously calculate the style and layout*. This is also called reflow or layout thrashing, and is common performance bottleneck.
Generally, all APIs that synchronously provide layout metrics will trigger forced reflow / layout. Read on for additional cases and details.
elem.offsetLeft
, elem.offsetTop
, elem.offsetWidth
, elem.offsetHeight
, elem.offsetParent