Hack: Detect DOM node insertions using plain CSS
David Walsh from Mozilla shows how to fire 'DOM changed' events from CSS. No need for JS to observe DOM mutation events or check the DOM manually – simply put: no deprecated API, no retarding loops.
With the CSS in place you add a listener for your custom 'DOM changed' event and that's it!
Related cards:
Cross-Domain Data with Rack and Rails | Union Station
Asynchronous JavaScript and CSS, also known as CSSHttpRequest, is a method of URI-encoding data in 2KB chunks split over several CSS rules with a modified data URI scheme. Because CSS is not subject to the same-origin policy, no service proxy is r...
Using CSS3PIE cross-domain
Currently not possible as the linked .htc file contains JavaScript which is not explicitly called.
The developers are working on a pure JavaScript solution which will have some downsides but work across different domains.
CSS: Using interaction media detection to disable hover styles for devices that have no hover
Since late 2015, all major browsers (still excluding Firefox) support pointing device media queries. These can be used to distinguish e.g. coarse from fine pointers (e.g. finger vs mouse), or a device with hover support from one without (e.g. de...
Get the last leaf of a DOM tree (while considering text nodes)
I use this to simulate the (non-existing) :last-letter CSS pseudoclass, e. g. to insert a tombstone at the end of an article:
findLastLeaf = ($container) ->
$children = $container.chi...
Different CSS for IE using Sass
At times, it might be unavoidable to have different CSS rules for Internet Explorer than for sane browsers. Using Sass, this can be achieved in a relatively non-hackish way without CSS hacks.
Step 1
Move your curr...
About PIE – CSS3 PIE: CSS3 decorations for IE
CSS Level 3 brings with it some incredibly powerful styling features. Rounded corners, soft drop shadows, gradient fills, and so on. These are the kinds of elements our designer friends love to use because they make for attractive sites, but are d...
Yarn: How to recognize that you are using a different node version than your colleagues
The issue in this card can occur if the node_modules directory is checked into your Git repository. We usually recommend to exclude node_modules from version control.
In any case you should document which version of node to use in your pr...
How to grep through the DOM using the Capybara API
When your Cucumber feature needs to browse the page HTML, and you are not sure how to express your query as a clever CSS or XPath expression, there is another way: You can use [all](http://rubydoc.info/github/jnicklas/capybara/master/Capybara/No...
Angular: Fixing "Referencing DOM nodes in Angular expressions is disallowed"
Reason
If you are using Coffeescript, it is likely to be the culprit. Since Coffeescript always returns the value of the last expression, it may return DOM nodes:
# coffeescript
scope.focus = ->
element.focus()
# javascript
scope.focus...
Pure CSS Timeline | CSSDeck
Clever hack to allow user interaction without Javascript (by using radio buttons and selecting on :checked).