jQuery slidedown using wrapInner, а затем удалить после завершения

Question

Я испытываю ошибку Firefox (overflow property not implemented on fieldset) при использовании функции скольжения вверх/вниз в jquery.

Так что я хочу:

1. добавить внутренний DIV с помощью JQuery по щелчку
2. слайд это Div вверх/вниз
3. удалить внутренний DIV

Это то, что я до сих пор:

var $searchBtn = $form.find('.search-reveal');   
$searchBtn.click(function(e){    
    var $this = $(this), 
     $fieldset = $this.next(); 

    $this.toggleClass('open'); 

    // FIX Firefox bug - https://bugzilla.mozilla.org/show_bug.cgi?id=261037 
    var $fieldsetInner = $fieldset.children().eq(0) 
    if(!$fieldsetInner.is("div")){ 
     $fieldsetInner = $fieldset.innerWrap("<div></div>"); 
    } 

    if($this.hasClass('open')){ 
     $fieldset.addClass('open'); 
     $form.addClass('active'); 
     $fieldsetInner.slideDown('fast', 'easeInQuad', function(){ 
      // REMOVE Firefox bug fix 
     }); 
    } else { 
     $fieldsetInner.slideUp('fast', 'easeOutQuad', function(){ 
      $fieldset.removeClass('open'); 
      $form.removeClass('active'); 
      // REMOVE Firefox bug fix 
     }); 
    } 

    e.preventDefault(); 
}); 

У меня есть три d this предлагать исправить, используя display: table-column, но это не имело значения.

Answer 1

я написал отдельную функцию JQuery, чтобы сделать это:

$.fn.fieldsetSlideToggle = function (speed) { 
    var $this = $(this), 
     $inner = $this.children().eq(0), 
     display = $this.css('display'), 
     slideSpeed = speed ? speed : 'fast'; 

    // 1. Check if first child of fieldset is <div> 
    // 2. Wrap contents in <div> if not 
    if (!$inner.is("div")) { 
     $inner = $('<div />').html($this.html()); 
     $this.empty().append($inner); 
    } 

    // 3. SlideToggle on div 
    if (display == 'none') { 
     $this.show(); 
     $inner.hide().slideDown(slideSpeed, function() { 
      $this.html($inner.html()); 
     }); 
    } else { 
     $inner.slideUp(slideSpeed, function() { 
      $this.html($inner.html()).hide(); 
     }); 
    } 
} 

скрипку: http://jsfiddle.net/tbDRu/6/. Нажмите на кнопку для перемещения вверх или вниз по набору полей.