Tuesday, March 27, 2007

Creating sliding DIVs

Here is a tutorial for writing a sliding divs like you see on Digg or many other sites. It was written in response to another tutorial on implementing a similar behavior.

Both articles are worth reading as it spells out clearly how to do the effect. The version on firblitz takes a more object oriented approach. In both examples, the initial call is from an inline Javascript (a href="javascript:..."). There is nothing wrong with doing this, but to have an even cleaner separation between Javascript and the HTML presentation, it's best to not have inline Javascript at all. Instead, use the event model to attach the function to the event so that that the HTML is completely clean.

Start with the following addition to firblitz's javascript code.




function toggle() {
var sd = document.getElementById("slidediv");
if (sd.style.display == 'none') {
Slide('slidediv').down();
} else {
Slide('slidediv').up();
}
}
function init() {
// attach event listener to objects
var slidediv = document.getElementById("mydiv");
slidediv.addEventListener("click", toggle, true);
}
window.onload = init;



And the body of the html would just be:



clickme





To take it one step further, take out the inline styles. However, this introduced one problem. Javascripts is unable to access the style value directly if it is not an inline style. This is because the element's style is not the style of the CSS object that is assigned through the #id. Thus, you have to manually assign the styles to the element. This is the end result:



function toggle() {
var sd = document.getElementById("slidediv");
var styles = getComputedStyle(sd, '');
sd.style.display = styles.display;
sd.style.height = styles.height;
if (sd.style.display == 'none') {
Slide('slidediv').down();
} else {
Slide('slidediv').up();
}
}
function init() {
// attach event listener to objects
var slidediv = document.getElementById("mydiv");
slidediv.addEventListener("click", toggle, true);
}



And the body of the html is a clean:



clickme

Hello world!


Sunday, March 25, 2007

amateur photographer

I'm not even sure if I should classify myself as an amateur photographer at this point. While I'm enjoying taking pictures, I'm not really experimenting and practicing that much. I'm a long way away from the days when I thought about being a photographer shooting bikini models in exotic locations. I just enjoy taking out the camera and taking baby pictures and to capture memories and small things around the house such as the backyard and the animals that visits.

Still, I'm tempted to get a longer range telephoto lens and knowing that I'm not going to be a "serious" photographer, I have my eyes on a basic beginner lens: Canon EF 100-300mm f/4.5-5.6 USM. At around $285, it's inexpensive as lenses go, but after shelling out so much already, I'm in a belt-tightening mode. For now, I guess I should have it on my wish list.

Beginning PHP and PostgreSQL 8

This book by Jason Gilmore and Robert Treat (published by Apress) is meant to be a comprehensive tutorial on the PHP language and PostgreSQL for beginners. Don't expect it to be a detailed book focused on using PHP with Postgres. It's like two books in one. 2/3 of the book is devoted to teaching PHP and it's well written and easy to understand with plenty of examples. It covers additional topics that other beginning books sometime don't cover such as networking, secure programming and web services although not necessarily in great detail, but I like that it seeds the topic into beginners' heads.

The latter 1/3 is devoted to Postgres and provides better coverage then other stand alone Postgres book and more accessible then the Postgres documentation. It discuss database topics, postgres setup and administration and is a good reference source.

I would recommend this book to those who want to learn either these technology especially those who are going to work with PHP since most likely you'll be needing a database beyond the SQLite solution that comes with PHP.

The only area that I wish would be improved is more details on web services on the PHP side and a discussion on database replication on the Postgres side.

Monday, March 19, 2007

Y! Messenger Archive location

If you archive your messages in Y! Messenger and need to move to another location, the files are stored in:

Program Files\Yahoo!\Messenger\Profile\\Archive\