Hidden Div Layers

I recently started to modify the design for the Chains and Charms Pandora bracelet builder to be more user friendly.

At first, I thought I would have to learn the ins and outs of AJAX being used in combination with Coldfusion, but I found this to not be the case. I initially saw that this one interactive online application was made of roughly 10 Coldfusion pages and even more Javascript files. This was intimidating, but I’ve found for the most part that the visuals I had to change were all modifiable on the same page. This was made possible by some handywork with div layers and some skillfull CSS style sheet creation.

Since this bracelet builder had a lot of components, I was facing a lot of div layers, most of which were hidden from the start. Changing these was best done by figuring out which div contained what component and then altering the CSS style sheet. The large quantity of div layers and the fact that so many were hidden made the prospect of relocating and resizing these by mouse click in the design view a nightmare.

Luckily, the div layers were all named with descriptive and relevant ids so figuring out which div contained what content wasn’t too much of a pain. So the lessons learned are, that descriptive names for your div layers can make future modifcations less of a headache and the other lesson would be that you should know how to use CSS style sheets if you don’t already.