How to Make a Password Strength Meter for Your Register Form
A small tutorial on how to build a password strength meter like the one on Google's new account form.
Blog:
mHub -
Read More...
Photo Notes - A Flickr Notes-Esque Photo Annotation Script
Photo Notes is a JavaScript implementation of photo "annotations". Stylistically, it's based on Flickr's "Notes" feature. Under the hood, it's loosly based on the FotoNotes implementation. However, for the most part, it has been completely rewritten. Photo Notes makes no attempt to serialize the notes in any way, as that is completely system and language dependent. Instead, it provides JavaScript objects and methods for displaying and manipulating the notes. The Save and Delete functions have been stubbed out, and must be implemented separately. A typical Save method, for example, would make an AJAX call to the server, which would in turn save the note to a database.
Blog:
mHub -
Read More...
How To Minimize Your Javascript and CSS Files for Faster Page Loads
Over the last 11 years I've spent a great deal of time trying to improve client websites with an eye for minimalist interface design and code. While the minimalist design esthetic is not the choice for every client the notion of less code and faster load times always goes over well. Today, many of web applications I design and code for have a plethora of Javascript and CSS files. Fortunately, there are many options to solve this rather simple problem. Compression, obfuscation and bundling are all great options.
Blog:
Max Kiesler -
(11)
Comment(s) -
Read More...
Dynamically loading an external JavaScript or CSS file
The conventional way to loading external JavaScript and CSS files on a page is to stick a reference to them in the HEAD section of your page. Files that are called this way are added to the page as they are encountered in the page's source, or synchronously. For the most part, this setup meets our needs just fine, though in the world of synchronous Ajax design patterns, the ability to also fire up JavaScript/ CSS on demand is becoming more and more handy. In this tutorial, lets see how it's done.
Blog:
mHub -
Read More...
Drag and Drop Table Rows With Javascript
There are many articles on implementing drag and drop in Javascript and many excellent frameworks and libraries that provide you with everything you need. In fact I use Script.aculo.us quite a bit. However, I haven't found anything much that tells you how to re-order rows in a table. Table rows are different from other elements normally used for drag and drop such as list items or divs because they can't be moved about in the same way. It wouldn't make sense to have absolute positioning on table rows-they sort of have to be in the table. There are also limitations on the styles you can put on rows, you can't have a border round them for example. So, the solution to this problem is slightly different from other drag and drop mechanisms.
Blog:
mHub -
Read More...
How to choose a JavaScript Framework
A JavaScript framework may not make you a better programmer, but it will make you more efficient. That alone should be reason enough to choose a JavaScript framework, or library if you prefer. Unless you decide to build your own, there are plenty of options available to developers. However, choosing the right framework can be tricky, and weeding through a mess of opinionated fanboys (myself included) is intimidating.
Blog:
mHub -
Read More...
Accelerated DOM Scripting with Ajax, APIs and Libraries
JavaScript libraries have been around in one form or another for almost as long as JavaScript itself. As you go from project to project, it’s inevitable that you’ll find yourself reusing various functions. They become part of your core that you end up copying each time you start up something new. With any good library, code reuse leads to reliability; using the same code on multiple projects means that the code has been exposed to more and more people, enabling bugs or cross-browser issues to be resolved.
Blog:
mHub -
Read More...
Bundle-Fu - Bundle Your JS/CSS Assets in 10 Seconds or Less
Web 2.0 sites have lots of tiny javascript/css files, which causes one extra round trip per file to the server and back! This is bad! Bundle-fu throws it all up into a big package and sends it out all at once.
Blog:
mHub -
Read More...
Learning AJAX & Javascript by Example - Tutorials, Source-Code and Documentation
I learn the best by example, so I read about, and try, as many AJAX and Javascript examples as I can find. Below you'll find a short list of the AJAX tutorials and examples that I've seen recently. They have all been organized by category with the exception of the "General" category which includes some example that didn't lend themselves to a vertical. Please let me know through email or a comment if you know of any other great AJAX tutorials, and I'll be glad to post them. Also special thanks to all of the folks who produced all of these great free learning experiences.
Blog:
Max Kiesler -
(0)
Comment(s) -
Read More...
vegUI - Javascript AJAX Framework
vegUI is a javascript AJAX framework and widget-collection that allows you to build dynamic web applications that are also fast and flexible.
Blog:
mHub -
Read More...
Javascript Image Magnification 2.3
PopBox is an image magnification javascript solution for dynamically moving and resizing images on your web page. Javascript? Yes - I know it's nothing new and that you've been able to move and resize things in Javascript for years, but only now is there a prepackaged solution that makes it as easy as 3 lines of HTML without knowing a lick about positioning!
Blog:
mHub -
Read More...
The JavaScript (Canvas) Hyperbolic Browser
A Hyperbolic Tree (HT) is a "focus+context" information visualization technique used to display large amount of inter-related data. This technique was originally developed (and patented) at Xerox PARC.
Blog:
VizLIst -
(0)
Comment(s) -
Read More...
jQuery Crash Course
As developers, we have more and more JavaScript libraries to choose from and, of course, the option not to use any at all. Over time, we each tend to favor one method of coding over another. For those who’d like to learn more about jQuery, one of the more popular libraries, here’s a crash course written with code-savvy web designers in mind.
Blog:
mHub -
Read More...
RND - Fast and Simple JS Template System
As web applications get more dynamic and complex, it's crucial to know what's the fastest way to render content. I have done some research and I am gladly sharing it with you.
Blog:
mHub -
Read More...
Aptana The Web IDE
Aptana is a robust, JavaScript-focused IDE for building dynamic web applications. Highlights include a Code Assist for JavaScript, HTML, and CSS languages, including your own JavaScript functions. Plus many more.
Blog:
mHub -
Read More...
Javascript Boot Camp Tutorial
Even though AJAX wouldn't ever have become so popular if the Javascript world hadn't suddenly exploded with mature development and testing tools, there's little information on how to be a really good Javascript programmer. This talk is for everyone who feels their Javascript skills just aren't up to snuff.
Blog:
mHub -
Read More...
Mouse wheel programming in JavaScript
Web applications are becoming more and more like "normal" desktop applications. Of course, they are more and more functional, but smooth user interface acts the primary role. So we have drag and drop, autocompletition, and much more. Many of those nice features got possible only with help of AJAX. This page, however, is not about AJAX (or any other buzzword). It is about rather simple user input method -- mouse wheel.
Blog:
mHub -
Read More...
Javascript Sockets
I could not find a single way to have real sockets in Javascript. Google told me that there probably is no solution except embeding a java applet or an active-x component! So I thought why not using a little .swf file as a bridge from javascript to the socket functions of flash!
Blog:
mHub -
Read More...
getElementsByClassName Deluxe Edition
Anyone who's into javascript will most likely have written their own take on a getElementsByClassName function. I had a look around at a few recent examples and then decided to do my own version for fun. Out of all of the functions I looked at Robert Nyman's came closest to what I wanted (kudos!) but my version has a few subtle differences up it's sleeve.
Blog:
mHub -
Read More...
Six key JavaScript techniques
These are six techniques I have found to be invaluable in my JavaScript/AJAX development. If you are using library like Prototype.js, these techniques will help you better understand what's going on behind the scenes.
Blog:
mHub -
Read More...
< 1 2 3 4 >
