I spent the better part of the last two evenings troubleshooting some problems with the Scriptaculous library. On one of the pages for the project I’m working on there’s an element that is supposed to expand with some dynamically generated content when the user clicks a link. This was easily accomplished, except that the element expanded too far momentarily and then jumped back to the right size, creating a slight flicker. It also turns out that the element was expanding each time I clicked the link, so that it would start out with a hight of 24px, then be 36px, then 48px, and so on.

After way too much work, I realized that it was taking into account the size of the padding and border when determining the height to render.

Since I haven’t used it much, I naturally assumed that I was the one in error, but it turns out, the problem may actually be with the library. Anyway, after a lot of hacking away at it I finally achieved the effect I wanted and am that much smarter with Prototype now.

There’s a definite satisfaction with finding the solution to difficult problem.