A rather geeky/technical weblog, est. 2001, by Bramus
Possible thanks to the Device Orientation Events. Facebook’s Paper photo tilt feature in HTML5 →photoTilt Demo →photoTilt Source (GitHub) → Did you know that this doesn’t work on a Retina MacBook Pro, but does on the previous MacBook Pro model? It’s the Sudden Motion Sensor which affords orientation detection, yet one cannot find that sensor …
Continue reading “Facebook’s Paper photo tilt feature in HTML5”
If you’re developing a library on the other hand, please take a moment to consider if you actually need jQuery as a dependency. Maybe you can include a few lines of utility code, and forgo the requirement. If you’re only targeting more modern browsers, you might not need anything more than what the browser ships …
Speed comparison between Grunt and the aforementioned Gulp All Gulp plugins are just duplex streams that read in data and output data. Everything can be processed in memory, with the output of one stream piped as input to another. Much like Unix pipes. This gives Gulp a huge speed advantage over Grunt, because I/O is …
Planetary.js is a JavaScript library for building awesome interactive globes. It is based on D3.js and TopoJSON and has built-in support for zoom, rotation, mouse interaction, and displaying animated “pings” at any coordinate. Via plugins, Planetary.js can be extended to do whatever you want! Planetary.js → Planetary.js Seismic Activity Demo →
gulp.task(‘sass’, function() { return gulp.src(‘src/styles/main.scss’) .pipe(sass({ style: ‘compressed’ })) .pipe(autoprefixer(‘last 2 version’, ‘safari 5’, ‘ie 8’, ‘ie 9’, ‘opera 12.1’, ‘ios 6’, ‘android 4’)) .pipe(gulp.dest(‘dist/assets/css’)) }); Gulp is a build system and performs tasks such as the ones we do using Grunt: minify, concat, prefix, uglify, etc. Main difference: Gulp allows you to input your …
Koa is a new web framework designed by the team behind Express, which aims to be a smaller, more expressive, and more robust foundation for web applications and APIs. Through leveraging generators Koa allows you to ditch callbacks and greatly increase error-handling. Koa does not bundle any middleware within core, and provides an elegant suite …
Continue reading “koa – next generation web framework for node.js”
One of the assignments of one of the courses I teach requires my students to let a cube fall in a Three.js environment. To teach them about how something falls I used Choc to visualize and explain the process of falling per tick of the animation. The final code is available on CodePen. JavaScript Bouncing …
Last November I was lead technical reviewer for a book titled Google Maps JavaScript API Cookbook. On December 26th – my birthday, of all days – the book was released on Packt Publishing. It’s a very practical book with lots of code (hence it being a cookbook) touching basic map interactions, custom layers, drawing stuff …
A trend I’m seeing for the coming year is the rise of Transitional Interfaces on the web. A fine example is the aforementioned Fluidbox, or this interface (extract from the post linked): Sparked by the post linked — which you should read — I started goofing around with CSS transforms and transitions a bit. The …
I adore the smooth transition offered by Medium’s lightbox module — no disruptive modal window, and opening/closing of the lightbox is intuitive and straightforward. So I tasked myself with a little challenge — replicate it, and improve on it, if possible. CSS transitions and transforms FTW Fluidbox Demo → Fluidbox Source (GitHub) → Fluidbox Explanation →