Live filter using CSS selectors

Using data- attributes for indexation, and a dynamic stylesheet with a CSS3 selector for search, it is straightforward to implement a client-side full-text search in CSS rather than JavaScript. Clever use of data-* attributes. A shame though the title of the original post, namely Client-side full-text search in CSS, is poorly chosen though, as it’s …

Sizing (Web) components by adding a Trojan horse into your CSS

So when it comes to changing the size of a component [of a framework], for example making a Slider bigger for touch input, it might get tedious fiddling with all the widths/heights, border-radi.. etc. So how can we make it easier? Well, by sneaking a Trojan horse into your components and use it to control …

The Future of Responsive Digital Layout

Wielding the tools from CSS and browser layout can enable stunning visualizations for web content. Using web features like CSS filters, WebGL, HTML5 video, SVG, canvas and evolving future tech like CSS Regions, CSS Shapes and CSS Custom Filters promises a hugely expanded creative landscape. National Geographic: Forest Giant (Demo) → Next Generation Web Layout: …

Jake Archibald – Rendering without lumpy bits

Right, we’ve got a new project, we have to calculate and draw 500,000 pixels, and the deadline is in 16.67 milliseconds. When we’re done, we’ll do it again, and again. Web performance has always been about delivering those pixels on time, but the target has shifted. Optimising pure JavaScript (loops, string concatination, arithmetic) is more …