Considering the following scenario:
We need to use some var or function schrodinger
but do not know if it is available.
So we try:
if(schrodinger){ ... }
=> ReferenceError: schrodinger is not defined
We could use..
/** | |
* Testing CSS Toggle() | |
*/ | |
/* Straight from the Spec | |
http://dev.w3.org/csswg/css3-values/#toggle | |
*/ | |
ul { list-style-type: disc; } | |
ul ul { list-style-type: toggle(disc, circle, square, box); } |
// OUTLINES FIXED WIDTH elements | |
// @author: davidhund @valuedstandards | |
// Very Quick and Dirty! | |
// Depends on jQuery but loads it if it is not present. | |
// For the love of JS: adapt this to your needs! | |
// Did I mention this is quick and dirty? | |
// OH, GO MAKE A BOOKMARKLET! | |
// Paste the "javascript:..." in a new Bookmark etc. |
// LIQUIFY | |
// Quickly Debug Responsive issues | |
// (Quite specific for a certain project :)) | |
// This script removes all(!) fixed width, sets them to auto | |
// and sets some basic fluid layout styles | |
// This allows us to quickly debug issues with fixed width components. | |
// It's a starting point for 'bolt-on' (I _know_) RWD |
Considering the following scenario:
We need to use some var or function schrodinger
but do not know if it is available.
So we try:
if(schrodinger){ ... }
=> ReferenceError: schrodinger is not defined
We could use..
/** | |
* Little Logo Experiment | |
*/ | |
body { | |
font-size: 125%; | |
text-align:center; | |
padding-top: 10%; | |
} | |
.border-style .d, |
// How To Decide Which Browsers are Handles as 'HTML5' | |
// We should pick/adapt to our personal situation but these are some good starting points... | |
// Notably: IE8 is _not_ considered 'HTML5 supporting'. | |
// 1) The BBC original... | |
// http://responsivenews.co.uk/post/18948466399/cutting-the-mustard | |
if('querySelector' in document && 'localStorage' in window && 'addEventListener' in window) { | |
document.documentElement.className += 'js'; | |
// bootstrap the javascript application | |
} |
I have this Grunt issue where browserSync injects a changes stylesheet before Autoprefixer is done with it. Basically: | |
1. `Watch` picks up on a changes `style.scss` and runs the `sass:dist` task | |
2. `sass:dist` outputs `style.scss` -> `style.min.css` | |
3. next: the `autoprefixer` task processes `style.min.css` | |
4. **but** in the mean time `browserSync` picks up on the changes `style.min.css` and injects it | |
5. only now `autoprefixer` finishes with `style.min.css`… | |
This means my injected `style.min.css` remains out-of-date (no prefixes)... |
module.exports = function(grunt) { | |
// Project configuration. | |
grunt.initConfig({ | |
pkg: grunt.file.readJSON('package.json'), | |
// Watch | |
watch: { | |
options: { | |
cwd: 'httpdocs/' |
module.exports = function(grunt) { | |
// Project configuration. | |
grunt.initConfig({ | |
pkg: grunt.file.readJSON('package.json'), | |
// Watch | |
watch: { | |
options: { | |
cwd: 'httpdocs/' |