2つのタブスクリプトを組み合わせて1つにする

Question

以下の2つのスクリプトを組み合わせることができれば幸いです。最初のスクリプトのスムーズな折りたたみ機能と、2番目のスクリプトの1タブ拡張機能を組み合わせることができます。コードを完全に追加できませんでしたので、必要に応じてリンクを参照してください。

私は本当にこれを感謝します！

スクリプト1：（完全 - http://jsfiddle.net/HcJJZ/3/）

$(document).ready(function() { 
$.effects.effect.heightFade = function(o, done) { 
    var el = $(this), 
     mode = $.effects.setMode(el, o.mode || "show"); 
    el.animate({ 
     height: mode, 
     opacity: mode 
    }, { 
     queue: false, 
     complete: done 
    }); 
}; 
$('.mytabs').tabs({ 
    hide: "heightFade", 
    show: "heightFade", 
    collapsible: true, 
    selected: -1 
}); 

スクリプト2：（完全 - http://jsfiddle.net/fb0z3ezd/4/）

var inactiveOpts = { 
active: false, 
show: { 
    effect: 'blind' 
} 
var $tabs = $(".tabs").each(function() { 
var currTab = this, 
    tabsOpts = { 
     collapsible: true, 
     beforeActivate: function (evt, ui) { 
      $tabs.not(this).tabs("option", inactiveOpts) 
     }, 
     activate: function (evt, ui) { 
      $(currTab).tabs('option', { 
       show: false 
      }); 
     } 
    } 
$.extend(tabsOpts, inactiveOpts); 
$(this).tabs(tabsOpts); 

Answer 1

これを試してみてください：ここで

がJSFIDDLEです： enter link description here

$(document).ready(function() { 
    $.effects.effect.heightFade = function(o, done) { 
     var el = $(this), 
      mode = $.effects.setMode(el, o.mode || "show"); 
     el.animate({ 
      height: mode, 
      opacity: mode 
     }, { 
      queue: false, 
      complete: done 
     }); 
    }; 
    $('#tabvanilla').tabs({ 
     hide: "heightFade", 
     show: "heightFade", 
     collapsible: true 
    }); 

    $('#flexslider1').flexslider({ 
     animation: "fade", 
     pauseOnHover: true, 
     controlsContainer: ".flex-container1", 
     directionNav: true, 
     controlNav: true 
    }); 

    $('#flexslider2').flexslider({ 
     animation: "fade", 
     slideshow: false, 
     pauseOnHover: true, 
     useCSS: false, 
     controlsContainer: ".flex-container2", 
     directionNav: true, 
     controlNav: true 
    }); 
var inactiveOpts = { 
    active: false, 
    show: { 
     effect: 'blind' 
    } 
} 

var $tabs = $(".tabs").each(function() { 
    var currTab = this, 
     tabsOpts = { 
      collapsible: true, 
      beforeActivate: function (evt, ui) { 
       $tabs.not(this).tabs("option", inactiveOpts) 
      }, 
      activate: function (evt, ui) { 
       $(currTab).tabs('option', { 
        show: false 
       }); 
      } 
     } 
    $.extend(tabsOpts, inactiveOpts); 
    $(this).tabs(tabsOpts); 

}); 
}); 

希望します。