外部のコンテナは、展開スクリプトでは拡張されていません

Question

したがって、私は、ホバーとクリックに基づいて展開して折り畳む関数をいくつか持っています。この機能は基本的なテストでうまく動作しますが、サイトでは機能しません。ユーザがExpand AとExpand Bをクリックすると、外側のコンテナは、jsFiddleでテストできるように展開されます。しかし、同じコードがmain siteに適用された場合、外側のコンテナは展開されたdivで展開されません。代わりに、それが長すぎる場合、拡張されたdivを持ちます。私はここで何が欠けていますか？

ありがとうございます。 Rex

P. jQueryの新しいバージョンやレイアウトを変更することはできません。それがCMSです。しかし、私はCSSのプロパティとJavaScript関数を変更することができます。

jQueryのスクリプトは、テストバージョンで正常に動作します：http://jsfiddle.net/rexonms/pXm62/

しかし、それはサイト上では動作しません：私はあなたのフィドルには何も見ることができなかったhttp://boston.staging.ujcweb.org/expandable-box.aspx

Answer 1

あなたのhttp://boston.staging.ujcweb.org/js/globalPage.jsファイルにadjustLayoutという名前の関数があり、その高さはdiv#ctl00_ContentPlaceHolder1_supportingElementsに動的に設定されています。したがって、あなたの箱はコンテナを押すことができません。

これを試すことができます。 http://boston.staging.ujcweb.org/local_includes/top-nav.jsスクリプトの下部にあるトグル機能を次のように変更してください。

$("a.trigger").click(function() { 
    var $this = $(this), 
     $container = $('#ctl00_ContentPlaceHolder1_supportingElements'); 
    if($this.hasClass('active')) { 
     $container.height($container.data('height')); 
    } 
    else { 
     $container.data('height', $container.height()).css('height', 'auto'); 
    } 
    $(this).toggleClass("active").next().slideToggle("slow"); 
    return false; //Prevent the browser jump to the link anchor 
}); 

Answer 2

。しかし、メインサイトでは、コンテナctl00_ContentPlaceHolder1_supportingElementsは、要素のスタイルタグに676px（動的に設定されている可能性があります）のheightが設定されていました。それが問題の原因です。それを削除するか、それを子要素展開のために働いたmin-heightに変更してください。