Archive results for: JavaScript

JavaScript Testing Presentation

Ryan Anklam from Netflix does a nice presentation at this years HTML5Dev Conference on how to test your JavaScript with some of the popular testing frameworks such as Jasmine, Mocha, QUnit and others.


HTML5 Tip: Placeholder atttribute

The HTML5 placeholder attribute lets you provide a short hint that helps people enter the right information into a form field.

The hint might be an example of the required information, or a description of the expected format. The placeholder hint or description is displayed inside the empty form field, and is removed as soon as the field is given focus.

Placeholder Uses

The trouble is that once the field is given focus and the placeholder text disappears, there’s nothing left to explain what kind of information should be entered. It’s also inconvenient for keyboard users. Instead of tabbing onto a field and reading the label, they need to look ahead to read the placeholder before moving focus to the field itself

http://www.nngroup.com/articles/form-design-placeholders/
Read more ›


PPK Presentation on Mobile Viewports

Peter-Paul Koch(ppk) of QuirksMode.org gave a very interesting presentation at this years HTML5 Dev Conference about mobile viewports.


No More JS MVC Frameworks

frameworks

A framework is like an iceberg, that 10% floating above the water doesn’t look dangerous, it’s the hidden 90% that will eventually get you.

Joe Gregorio wrote a great article on why all these JS MVC frameworks aren’t necessarily a good thing. 


Introduction to JSON

With JavaScript we typically manage, store and pass around data via objects. However, there comes a time when you need to use data outside of JavaScript, either by sending (or retrieving) it from a web service, or perhaps by storing it locally in the browser.

Where XML is notoriously difficult to parse in some cases, using JSON (JavaScript Object Notation) to store our JavaScript objects in the form of a string, it makes it lots easier to read and parse data.

Taking a simple JS object (in literal expression notation):

we can easily stuff it into a string:

You will notice JSON is broken down into a key/value pair wrapped in quotes. The data types can only be strings, numbers, objects, arrays Booleans or null. Read more ›


Convert Click to Touch Events

Have you ever noticed the delay that occurs between the time you tap your screen and page activity?

On touchscreen devices, the onclick event doesn’t fire immediately. Instead, the device waits up to a half a second. This provides the user with an opportunity to initiate some other gesture instead of a click.

Use the touchend event instead, which fired immediately when the user taps the screen. You may still want to handle the onclick event to ensure that the browser changes the appearance of the button to show a clicked state, and to support browsers that don’t handle touch events.

To prevent duplicate code of execution when both touched and onclick code fire, add a click event handler that calls preventDefault and stopPropagation if the click was the result of a user tap already handled by touchend.

Note: A jQuery plugin alternative would jquery.tap or touché.


Web Audio API – Sound on the Web

Sound on the web. I know. Historically, these two things haven’t gone together very well. But now, things have changed a bit, since we don’t have to rely on Flash anymore.

With the arrival of the <audio> tag and with more and more browsers implementing the Web Audio API we can produce sound natively in the browser with zero lag and with more control than we’ve ever had before.

We don’t even have to use audio files if we don’t want to. The Web Audio API allows us the create sound on the client, much like we do when creating images from scratch by painting to the canvas element. Read more ›


Page 1 of 212