- copy your image (
Ctrl+AandCtrl+C) - make a new document-sized pure-black layer behind it
- group the black layer and yor image together
- add mask to the group
- enter mask edit mode (
alt+clickon the mask icon/thumbnail) - paste your image in the mask (b/w) and then invert it.
- save it as a 24-bit transparent PNG
'What Colour Is It' in 466 bytes
annotated.html have comments to explain what is happening in that script;
- Responsive;
- Font resize based on the size of the window;
- Should take care of retina displays (i can't test)!
- Should support all recent browsers. (but i can't test all of then, would be nice some help).
Following is a translation of a post by Kenta Cho (@abagames) about what he learned making 50 minigames in 2014. The original post is here:
http://d.hatena.ne.jp/ABA/20141223#p1
This translation is by Paul McCann (@polm23); please feel free to contact me with any comments or corrections.
... is that there isn't one.
-
Add the [https://github.com/floatinghotpot/cordova-plugin-nativeaudio](Cordova Native Audio Plugin) to your project:
cordova plugin add cordova-plugin-nativeaudio -
Include sound-patch.js in your HTML, or just paste the code wherever you want it.
This doesn't support looping or volume. Modify the code to use NativeAudio.preloadComplex accordingly.
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
To make this work in CSS:
background: url('images.svg#chart');or img:
<img src="images.svg#chart">| { | |
| "require": { | |
| "mfacenet/hello-world": "v1.*" | |
| } | |
| } |
| /** | |
| * Calculate brightness value by RGB or HEX color. | |
| * @param color (String) The color value in RGB or HEX (for example: #000000 || #000 || rgb(0,0,0) || rgba(0,0,0,0)) | |
| * @returns (Number) The brightness value (dark) 0 ... 255 (light) | |
| */ | |
| function brightnessByColor (color) { | |
| var color = "" + color, isHEX = color.indexOf("#") == 0, isRGB = color.indexOf("rgb") == 0; | |
| if (isHEX) { | |
| var m = color.substr(1).match(color.length == 7 ? /(\S{2})/g : /(\S{1})/g); | |
| if (m) var r = parseInt(m[0], 16), g = parseInt(m[1], 16), b = parseInt(m[2], 16); |