JavaScript

jQuery 1.4 released

Tags:

My favourite Javascript library, jQuery has a new version, jQuery 1.4.

It features some of these

  • Even better performance compared to v. 1.3.x
  • Serialization like PHP, same param serialized like foo[]=bar1&foo[]=bar2
  • Easy Setter Functions
  • The performance of .css() and .attr() has been improved
  • All Events Can Be Live Events

Gmail style Static message box using jQuery

Tags:

If u want to see a gmail style, "Loading" message box on ur application, its extremely simple using jQuery and CSS. All u need to know is

  1. jQuery
  2. HTML and good CSS, duh!

Photography is like Javascript

Tags:

A lovely quote from one of my favourite feeds, dustindiaz.com

Photography is like JavaScript
As if you didn’t know it was coming to this. But let me be the first to put it into words. Photography is like JavaScript, and JavaScript is like photography. They are both expressive and beautiful. They can be done bad or good ... Both can detailed and complicated. Both can be simple. They are both object-oriented.

..more

A better $ function

Tags:

U may remember the $ function from prototype.js and the famous Top 10 JavaScript Functions.

It was when it struck me, that the multiple arguments to the $ function returns an array, a numeric index based array. So to refer to the numeric indexes, u need to remember the order that u'd specified ur ids.

My new $ function is a little better, it returns an object with the id's name as the member name.

function $() {
	var elements = {};
	for (var i = 0; i < arguments.length; i++) {
		var element = arguments[i];
		if (typeof element == 'string')
			element = document.getElementById(element);
		if (arguments.length == 1)
			return element;
		elements[arguments[i]] = element;
	}
	return elements;
}

AJAX: Hotmail vs Yahoo Mail

Tags:

So both Yahoo Mail! and Hotmail have come up with their AJAX based UIs. Its time I did a comparison.

Yahoo! Mail

yahoo-mail-ajax.gif

Hotmail

hotmail-ajax.png

Use of Colors, Icons, images

  • Hotmail, has worked upon its old icons, making them with gradient backgrounds though.
  • Yahoo has created bold new Icons, Their Icons are more intuitive. They are bigger, considering the higher resolutions (more than 1024 x 768). Hotmail’s icons’ main image still is small, with Text beside it to help
  • Hotmail has already given multiple themes like Blue, Red, Black, Sliver, Yahoo still lacks it, or atleast I wasn’t able to find it.

Read the rest of this entry »

Web Accessibility: Anchor tags for Popup windows

Tags:

Many a times, on your page, you need to have a JavaScript pop-up window for Slideshow, gallery, comment form, etc. But you also want to have your site WAI compatible. What do you do ?

The idea is to pop-up windows in Browsers that support JavaScript and provide actual href value to the Anchor tag a. But also provide an onclick event that pops up the window.

Spawning popup windows in Firefox

Tags:

New browsers like Firefox(my fav.), IE 7 are very intelligent, they will not allow the standard popup of window.onload or standard...

...
<body onload="load_popup()">
...

They have decent pop-up blockers, which we want to escape.

The new browsers, will consider it a spammed popup, and will kill it before its spawned. They will only create a popup if there is user interaction, as you can see, window.onload and body's onload is not user interaction.

So, how should my advertiser's pop-up be displayed? What user interaction should I wait before I get my popup?

JavaScript

Tags:

A lot is still unexplored in this area (of JavaScript). I shall try to help out others, who are keen to get with it.

var js = {
  lang: "JavaScript",
  amIGood: function () { return "O u bet!"; },
  start: function () { return "Read more on ruturaj.net"; }
};

alert(js.amIGood());
alert(js.start());

Creating a Live Score Board Client Logic

Tags:

The the custom JavaScript object player is defined as below.

function player () {
	
	this.name = '';
	this.serving = false;
	this.gamepoint = 0;
	this.sets = new Array();
	
	this.toString = function() {
		return (this.name + ": " + (this.serving ? 'Serving' : 'Facing') + "\n" + this.sets + "\n" + this.gamepoint);
	}
}

The sets member variable is an array.

Creating a Live Score Board Client Logic

Tags:

Let us start with a script tag that will enclose all the fundooo script. You can save in a .js file as well if you want...

The httpObj is the XMLHttpRequest object, and xmlScore is the response XMLDocument. I've created a player object class which is used by the tplayers variable.