Articles tagged 'JavaScript'

Blog Projects

Chained Selects Stable Release

Chained is now stable and in feature freeze. In 2.x.x version class support will be removed. Next major version will use data attributes will be used instead. After all, it is 2014 already!

Legacy syntax removed

Stable version removes legacy syntax. It is not 100% compatible with 0.9.x branch. You must pass all options to remote version as JavaScript object. Example of all possible options below.

$("#series").remoteChained({
    parents : "#mark",
    url : "/api/series.json",
    depends : "#series",
    loading : "Loading.",
    bootstrap : {
        "" : "--",
        "series-3" : "3 series",
        "series-5" : "5 series",
        "series-6" : "6 series",
        "series-7" : "7 series",
        "selected" : "series-3"
    }
});

Class based version does not have any configuration. You only need to pass parent selector.

$("#engine").chained("#series, #model");

Continue reading >>


Chained Selects for Zepto

New version of Chained mostly updates the remote version. Plugin now supports both Zepto and jQuery. You can avoid initial AJAX requests by bootstrapping select values. You can configure extra values to be sent to server. Since plugin now accepts more configuration options new prettier syntax was implemented. Lastly support for Bower was added.

Zepto support

Since plugin uses :selected you must also include Zepto selector extension. It is not included by default.

<script src="zepto.js"></script>
<script src="zepto.selector.js"></script>
<script src="jquery.chained.js"></script>

After this you can use the plugin as you normally would.

Continue reading >>


Lazy Load 1.9.0 Released

CSS background images

You can now lazyload CSS background images. Bind the plugin to non image element and it will automatically change the background-image style attribute when element is scrolled into view. You can also use effects.

<div class="lazy" data-original="img/bmw_m1_hood.jpg" style="background-image: url('img/grey.gif'); width: 765px; height: 574px;"></div>

$("div.lazy").lazyload({
    effect : "fadeIn"
});

Continue reading >>


Lazy Load 1.8.0 Released

This version of Lazy Load is just a bugfix release. Minor release number bump is there because I pulled a new feature in last minute and I did not want to mess up my git branching. Bugfix usually does not normally warrant...

Continue reading >>


Lazy Load 1.7.0 Released

Previous version of Lazy Load gained traction pretty fast. Good patches were submitted to GitHub. This version of plugin mostly concentrates on speed optimization and event handlers.

New Events

Two new events were added....

Continue reading >>


Lazy Load 1.6.0 Released

After neglecting the code for a while I was finally able to release new version of Lazy Load plugin. Changes are not dramatic but there is one important thing. New browsers load image even if you remove the src attribute...

Continue reading >>


iPhone Controlled HTML5 Logo and Color Cube

When Apple released iOS 4.2 end of last year I was on a boat trip to Finland. For me the most interesting features were added to Safari browser. I wanted to learn about WebSockets. New DeviceOrientation API just begged to be abused. I had an idea...

Continue reading >>


Chained Selects jQuery Plugin

Latest usage and examples can be found from separate chained selects project page. There is also a demo page.


Photo Dan Barbus

Recently I needed to do chained select navigation for a project. It was relatively simple. I did not want to go through...

Continue reading >>


Tuning Lazy Loader

Latest version of Lazy Load is not a drop in replacement to your webpage. New browsers load image even if you remove the src attribute with JavaScript. Now you must alter your html code. Put placeholder image into src attribute of your img tag. Real...

Continue reading >>


Verify Estonian Isikukood With JavaScript

Yesterday I had to verify Estonian national identification number with JavaScript. The formula is pretty simple. You just have to read it through couple of times to understand. If you need other languages Dmitri Smirnov has examples in PHP, Java and...

Continue reading >>


Lazy Load Inside Container

Latest version of Lazy Load is not a drop in replacement to your webpage. New browsers load image even if you remove the src attribute with JavaScript. Now you must alter your html code. Put placeholder image into src attribute of your img tag. Real...

Continue reading >>


Search jQuery API Docs from Spotlight

Yesterday Priit Haamer of Fraktal notified me about Spotlight searchable Ruby on Rails documentation he had made. Absolutely brilliant idea. When I saw it I knew I have to do same thing for jQuery.

Note: Last update to jQuery Spotlight dictionary was...

Continue reading >>


Lazy Load With Effects

Latest version of Lazy Load is not a drop in replacement to your webpage. New browsers load image even if you remove the src attribute with JavaScript. Now you must alter your html code. Put placeholder image into src attribute of your img tag. Real...

Continue reading >>


Lazy Load Sideways

HEADS UP! This article was written in 2007. Information provided might not be valid anymore and should be taken with a grain of salt.

Lazy Load plugin has been quite popular recently. Atleast two Prototype ports have been created. First one by...

Continue reading >>


Lazy Load Images jQuery Plugin

HEADS UP! This article was written in 2007. Information provided might not be valid anymore and should be taken with a grain of salt.

Lazyloader is inspired by YUI ImageLoader Utility by Matt Mlinac. After reading YUI introduction I though this...

Continue reading >>


Preload Images Sequentially With jQuery

HEADS UP! This article was written in 2007. Information provided might not be valid anymore and should be taken with a grain of salt.

Here is a small code snippet I use for preloading images for mouseovers. It uses $(window).bind("load", function...

Continue reading >>