Archive | Development RSS for this section

Prototype Framework for Javascript

After attending The Ajax Experience (many more posting coming on
this event), I was excited to start making use of Prototype to increase
my productivity while coding various Javascript routines and Ajax apps.

If you haven’t seen, or downloaded it yet, you can find Prototype
Framework for Javascript at:
http://www.prototypejs.org/

Probably the biggest time saver for me so far was the $(‘id’)
functionality, that returns a DOM element named id. This is
equivalent to document.getElementById(‘id) …. and has already saved
me tons of time.

However, one item to note…. and it is a simple mistake to make. In
putting together a quick test for this framework, I didn’t consider
that javascript that isn’t in a function can (and usually does) run
before the DOM is loaded. SO I was getting a lot of messages about
the element not having the properties that I was attempting to
modify. After making a “function doInit()” in javascript and
calling it using <body onload=”doInit()”>, then things worked *much*
better.

Again, great library and I believe the $$(‘css3 selector’) will also
save me large amounts of coding.

The great thing about this framework, is that it appears to be
compatible with all the major frameworks, and in some cases is used
inside their framework. So this is a great place to start, if you
are looking at using a javascript framework to enhance your web
applications, or coding style/speed.

Mezer Tools

Mezer Tools by Bayden Systems is a great utility for web developers. It provides you with an easy way to get exact screenshots as well as measuring with screen-calipers, color-grabbing, hex conversions, and generating psuedo-random text. It sits in the systray and provides the functionality that you commonly find in seperate tools/utilities. Check it out at: http://www.bayden.com/mezer/

Mezer-Tools

CSS Positioning (and when elements space is closed up)

When using relative positioning the space that the element normally needs is NOT closed up as the element is positioned.

However, when using absolute positioning the space that element normally needs IS closed up.

And don’t forget that positioning of an element is based on the “parent” element that was also positioned, otherwise it is the BODY/HTML element.