Mootools Javascript can't push to array

Question

I have an array set with the heights of each hidden div, but when I use it, the div instantly jumps down, rather than slowly sliding as when there is a literal number.

---

EDIT: testing seems to reveal that it's a problem with the push method, as content_height.push(item.getElement('.moreInfo').offsetHeight);alert(content_height[i]);gives undefined, but alert(item.getElement('.moreInfo').offsetHeight); gives the correct values

---

Javascript:

window.addEvent('domready', function(){

 var content_height = [];i=0;

 $$( '.bio_accordion' ).each(function(item){
  i++;
  content_height.push( item.getElement('.moreInfo').offsetHeight);
  var thisSlider = new Fx.Slide( item.getElement( '.moreInfo' ), { mode: 'horizontal' } );
  thisSlider.hide();


  item.getElement('.moreInfo').set('tween').tween('height', '0px');

  var morph = new Fx.Morph(item.getElement( '.divToggle' ));
  var selected = 0;
  item.getElement( '.divToggle' ).addEvents({
  'mouseenter': function(){
   if(!selected) this.morph('.div_highlight');
  },

  'mouseleave': function(){
   if(!selected) {
    this.morph('.divToggle');
   }
  },

  'click': function(){
   if (!selected){
    if (this.getElement('.symbol').innerHTML == '+')
    this.getElement('.symbol').innerHTML = '-';
    else
    this.getElement('.symbol').innerHTML = '+';
    item.getElement('.moreInfo').set('tween', {
     duration: 1500,
     transition: Fx.Transitions.Bounce.easeOut
    }).tween('height', content_height[i]); //replacing this with '650' keeps it smooth
    selected = 1;
    thisSlider.slideIn();
   }
   else{
    if (this.getElement('.symbol').innerHTML == '+')
    this.getElement('.symbol').innerHTML = '-';
    else
    this.getElement('.symbol').innerHTML = '+';
    thisSlider.slideOut();
    item.getElement('.moreInfo').set('tween', {
     duration: 1000,
     transition: Fx.Transitions.Bounce.easeOut
    }).tween('height', '0px');
    selected = 0;
   }
  }
  });

 } );




});

Why could this be? Thanks so much!

Answer 1

There's nothing wrong with your code. The push method works as expected - here's an example: http://jsfiddle.net/oskar/D2xps/

Answer 2

You need content_height[i - 1].

Also I'd recomend you use another indexing (since your code using global variable 'i' and it could fail because of closures):

$$( '.bio_accordion' ).each(function(item, index) {
    content_height[index] = item.getElement('.moreInfo').offsetHeight;

    ....

    tween('height', content_height[index]);


});