Posts Tagged ‘JavaScript’

We are pleased to present below all posts tagged with ‘JavaScript’.

Faster UI Animations With Velocity.js

From a motion design perspective, Facebook.com is phenomenally static. It's purposefully dumbed down for the broadest levels of compatibility and user comfort. Facebook’s iOS apps, on the other hand, are fluid. They prioritize the design of motion; they feel like living, breathing apps.

Faster UI Animations With Velocity.js

This article serves to demonstrate that this dichotomy does not need to exist; websites can benefit from the same level of interactive and performant motion design found on mobile apps. Before diving into examples, let's first address why motion design is so beneficial.

Read more...

Building With Gulp

Optimizing your website assets and testing your design across different browsers is certainly not the most fun part of the design process. Luckily, it consists of repetitive tasks that can be automated with the right tools to improve your efficiency.

Building With Gulp

Gulp is a build system that can improve how you develop websites by automating common tasks, such as compiling preprocessed CSS, minifying JavaScript and reloading the browser. In this article, we’ll see how you can use Gulp to change your development workflow, making it faster and more efficient.

Read more...

A Thorough Introduction To Backbone.Marionette (Part 3)

To help you tap the full potential of Marionette, we've prepared an entire eBook full of useful hands-on examples which is also available in the Smashing Library. — Ed.

In this series on Backbone.Marionette, we’ve already discussed Application and Module. This time, we’ll be taking a gander at how Marionette helps make views better in Backbone. Marionette extends the base View class from Backbone to give us more built-in functionality, to eliminate most of the boilerplate code and to convert all of the common code down to configuration.

A Thorough Introduction To Backbone.Marionette (Part 3)

I highly recommend that you go back and read the articles about Application and Module first, if you haven’t already. Some things may be mentioned in this article that refer to the previous articles, and this is part of a series about Marionette, so if you wish to learn about Marionette, you should read the whole series.

Read more...

Introduction To Developing Fireworks Extensions (They’re Just JavaScript!)

One of the most powerful features of Adobe Fireworks is that you can extend its functionality. Almost anything you can do through Fireworks’ interface — and even some things that you can’t — can also be achieved by writing a simple JavaScript extension.

Introduction To Developing Fireworks Extensions (They’re Just JavaScript!)

Fireworks extensions are of two main types: commands and command panels. If you find yourself repeatedly performing a tedious task, you could write a command to automate the process and save yourself a lot of time. Alternatively, if you are missing a particular feature that would improve your workflow, you could write a more complex extension — a command panel — to implement it.

Read more...

The Mystery Of The jQuery Object: A Basic Introduction

Have you ever come across a bit of JavaScript like $(".cta").click(function(){}) and thought, “What the $('#x') is that” If it looks like gibberish to you, then please read on. If you think that snippet of code couldn’t possibly be real, then please browse some jQuery examples. They are full of such constructions.

Beginners' JavaScript And jQuery Syntax

This article covers the key concepts that underly such intimidating fragments of code, but we’ll start with a longer example, based on an example for animating a square.

Read more...

Responsive Images Done Right: A Guide To <picture> And srcset

On Monday, we published an article on Picturefill 2.0, a perfect polyfill for responsive images. Today's article complements Tim Wright's article and explains exactly how we can use the upcoming <picture> element and srcset, with simple fallbacks for legacy browsers. There is no reason to wait for responsive images; we can actually have them very, very soon. — Ed.

Responsive Images Done Right: A Guide To <picture> And srcset

Images are some of the most important pieces of information on the web, but over the web’s 25-year history, they haven’t been very adaptable at all. Everything about them has been stubbornly fixed: their size, format and crop, all set in stone by a single src.

Read more...

Picturefill 2.0: Responsive Images And The Perfect Polyfill

Not since the early days of web standards have I seen our community rally around a seemingly small issue: responsive images. Over the last four years (yeah, it’s been about four years), we’ve seen many permutations of images in responsive design.

Responsive Images And The Perfect Polyfill

From the lazier days of setting max-width: 100% (the absolute minimum you should be doing) to more full-featured JavaScript implementations, such as Picturefill and Zurb’s data-interchange method, we’ve spent a lot of time spinning our wheels, banging our heads and screaming at the wall. I’m happy to say that our tireless journey is coming to a close. The W3C and browser makers got the hint.

Read more...

↑ Back to top