Question

I have some divs that I’m trying to toggle on and off. I’m running into a couple of problems.

When I use the toggle function it seems to only execute the first function, hiding the divs… but never executes the second one to show them. Also, on a styled div it does some really weird stuff to it. You’d need to see it to see what I’m talking about.

Basically what I’d like to do is make the toggle button make the divs scale down or up and move to the top right of the page or their original location. I haven’t tried implementing the movement yet… I’m just trying to get the scaling working at this point. Anyone know what I’m doing wrong? Thanks.

Here’s the page – http://synergydatasystems.com/animation_test/hint_test.htm

Answer 1

The reason that the toggle only works one way is that once you set it’s scale to 0%, clicking it again will try to set the scale to 100% of the current height. So basically, 0 at 100% is still 0. If you want to play with it to see what I mean, change the percent to 50 on first toggle and then to 200 on the second toggle. You will see that it works:

http://jsfiddle.net/tSEP5/