CSS QUICKIE

This is a little tutorial on how to create that Centerd Content layout that we all love.Lonely Flower is a typical example of such design.
Its quite simple. First thing you need to do is to create the DIV element that will contain the contents and then give it the required dimension via your css. for example:

This is my HTML:
< div id='main_container'>< /div >

and this is my CSS:

div#main_container
{
width:700px;
height:600px;
background-color:#fff;
border: #eee thin solid;
}


With the above code you have your styled DIV. To now move it to the center, to the already defined style just add:

margin:auto;

This will move the DIV to the center of the screen and the reason this is so is because the 'auto' value given to the 'margin' property will autamically assign the required amount of margin space to all the four sides of the div; thereby pushing it to the center.

SPELL CHECKER

Was strolling one nice evening on the tangled web street of the internet looking for anything Ajax in nature when i stumbled upon Jacuba. Jacuba is free on line spell checker that works nicely. With its ajax implementation, it has a really nice desktop-App feel. Apart from the on-line checker, they've got some other products that could be useful to you depending on what you do.You can go and check to see what i mean.

Semantic Ajax

Some school of thoughts argues that Ajax discourages the creation of websites using semantic XHTML design, and the separation of contents from presentation. They believe Ajax promotes creation of presentation with JavaScript, thus going against the idea of presentation being apart from content.

Although this allegation might be true, I don’t think it’s an inherit flaw in Ajax. It is more of how people are using it. The philosophy of Ajax does not necessary calls for content being muddled up with presentation, in fact with the proper use of CSS, Ajax application can be built with contents separated from presentation.

The technology that serves as the building blocks of Ajax clearly makes the creation of semantic Ajax application possible. This is because each building block is defined in its functions. And there is no reason why there should be overlapping of functions, if properly used.

I can divide the main components of any Ajax application into:

• The Asynchronous Components
• The Presentational Components
• The Content Components

And if each component is handled by the appropriate technology, then I see no reason why any Ajax application can’t be as semantic as required.

For example the Asynchronous components will be handled by JavaScript and the XmlHttp object.
The Presentational components should be handled by your CSS.
and the Content Components should be handled by the DOM, JavaScript and your XHTML.

It is when these three components are not properly separated that Ajax might be an aberration to semantic XHTML. For example using JavaScript for Presentational Components will not be good practice. Since CSS can style dynamically generated contents, there is actually no reason for using JavaScript instead.

So it’s all with the developer and not Ajax as a technology. With semantic XHTML, accessibility, and the separation of content and presentation in mind, you can still build your web application the Ajax way!

Application of the Month: 1st JavaScript Editor Pro

My application of the month is 1st JavaScript Editor Pro.

For writing JavaScript, I can say this is the best editor I have ever used; it does the job perfect.

I find the interface well layed out, friendly and intuitive.

Its Intellisense functionality is the most comprehensive I have come across so far for JavaScript, and I find that really helpful.

On top of it, it comes with an exhaustive inbuilt reference for Jscript, XHTML, CSS and Ajax.

I wanted an editor that will make authoring JavaScript easy and that is exactly what I got.

Things I have pet peeves with would have to start wth the applications splash screen! O'boy, isn't it the most ugly splash screen ever seen? Its very unimpressive. So also it the company's website Its just ugly! Its hard to reconcile such a useful software is created by a company with such an unimpressive website. I looked under the hood of the site

I guess when its comes to graphics, and general design, dudes over there are really wanting.

Another thing is that it seems folks at Yaldex are quite supportive of non-standard web practice. Take a look at their site and part of the code snippets that comes with the software and you will agree with me.

Apart from these, peeves, its a cool tool for anybody doing serious work with JavaScript. You can go and get a trial version.

My Comment on the Dojo ToolKit

The dojo toolkit is cool. It has a whole lot of functionality that comes in handy.

But one thing I would want those guys at Dojo foundation to do is to come out with a proper Documentation for the framework. Right now there exists nothing like Documentation. What you have, which is online, is absolutely nothing to write home about.

Instead of leaving developers with no other option but to start hacking the source codes so as to figure out how it works, I believe we will all be good for it if there is a comprehensive Documentation out there to download.

Using table.insertRow(): A word of advice

Only if I knew, I would have saved myself some countless hours of frustration…

Via JavaScript, you have an easy method of dynamically creating tables. The object representing the element has methods that easily helps in appending rows and cells. For example, lets say I have a variable otbody that is referencing the element, creating a row with three cells will be:

otbody.insertRow (0); //this creates the first row
otbody.rows[0].insertCell(0); //this makes adding cells possible
otbody.rows[0].cells[0].appendChild(document.createTextNode(‘Firstcell’));//populates the first cell
otbody.rows[0].cells[1].appendChild(document.createTextNode(‘Secondcell’));//populates the second cell
otbody.rows[0].cells[2].appendChild(document.createTextNode(‘Thirdcell’));//populates the third cell

What I did not know, which led to me wasting a lot of time, is that for this above code to work, the [otbody] object must be a child of the [table] object. What I did, which came out to be wrong, was that I attached the [otbody] to a [documentFragment] object and then append the [documentFragment] object to the [otable] object. I wanted a way of bunching the table’s content together so as to facilitate easy removal that was why I appended it to a [documentFragment] object; but that was wrong.

So to make the above code work, somewhere earlier in the source codes, I would have to include this:

otable.appendChild(otbody);