using conditional code with animate

Hi, I am trying to do something similar to this (generic html file with jquery):

$(document).ready(function () {

$( "#expand" ).click(function() {

  $( "#myname" ).animate({ "height": "+=50px" });

  $( ".myname" ).animate({ "top": "+=50px" });

});

$( "#contract" ).click(function(){

  $( "#myname" ).animate({ "height": "-=50px" });

  $( ".myname" ).animate({ "top": "-=50px" });

});

});

So, when #expand is clicked an item #myname is expanded and some class .myname items move down. Clicking #contract reverses this.

My edge code for a click on symbol named "r1" is below.

(Similar code exists for symbol "r2")

When I click r1 that symbol expands and the other items in class r1 all move down, OK.

Next, if I click another symbol, ie r2, the r1 symbol must first contract before r2 can expand.

This does not work. The item r1 does not contract -- but the class r1 does move up. I do not understand that.

//close a playing symbol, then play the clicked symbol

sym.$(playing).animate ({'height':'-=100px'}); // ... does not work

sym.$("."+playing).animate ({'top':'-=100px'}); // ... does work

--

//r1.click

//is any symbol is playing?

var playing = sym.getComposition().getStage().getVariable("myGlobal");

// nothing is playing

if (playing == "nothing") {

//set the global to show which was clicked

sym.getComposition().getStage().setVariable("myGlobal", "r1");

var playing = sym.getComposition().getStage().getVariable("myGlobal");

// play the clicked symbol

sym.$(playing).animate ({'height':'+=100px'});

sym.$("."+playing).animate ({'top':'+=100px'});

}

// do nothing if I am playing already

else if (playing == "r1"){

}

//close a playing symbol, then play the clicked symbol

else {

sym.$(playing).animate ({'height':'-=100px'});

sym.$("."+playing).animate ({'top':'-=100px'});

//update the global to which was clicked

sym.getComposition().getStage().setVariable("myGlobal", "r1"); // this would use a different value if a different symbol was clicked

var playing = sym.getComposition().getStage().getVariable("myGlobal");

// play the clicked symbol

sym.$(playing).animate ({'height':'+=100px'});

sym.$("."+playing).animate ({'top':'+=100px'});

}

---

Apologies for long post

phillip-j