JQM外部パネルにはカスタムカラーが含まれていません

Question

外部パネルにnativedroid JQMテーマを適用しようとしました。私はenhanceWithin()がこれを完全に解決するはずであることを知っていますが、そうではありません。 Nativedroid CSSの色は、外部パネルには適用されません。この動作を実証するためにJSFiddleを作成しました。通常のパネルであればOKですが、外部パネルは緑色のスタイルがなくても表示されます。この問題を解決するための方法

JSFiddle Example

？ケース誰かに

<script id="panel-init"> 
    $(function() { 
    $("#externalPanel").panel().enhanceWithin(); 
    }); 

</script> 


<div data-role="panel" id="externalPanel" data-position-fixed="true" data-display="push" data-theme="b"> 
    <!-- panel content goes here --> 
    <ul data-role="listview" data-theme="b" data-dividertheme="b" data-inset="false"> 
    <li>External Panel</li> 
    <li data-icon='false'><a href="#"><i class='lIcon fa fa-coffee'></i>Need a Coffee</a></li> 
    <li data-icon='false'><a href="#"><i class='lIcon fa fa-beer'></i>Have a Beer</a></li> 
    <li data-icon='false'><a href="#"><i class='lIcon fa fa-music'></i>Play Music</a></li> 
    <li data-icon='false'><a href="#"><i class='lIcon fa fa-fire'></i>Make a fire</a></li> 
    </ul> 
</div> 
<!-- /panel --> 

<div data-role="page" id="one" data-theme='b'> 
    <div data-role="panel" id="internalPanel" data-position-fixed="true" data-display="push" data-theme="b"> 
    <!-- panel content goes here --> 
    <ul data-role="listview" data-theme="b" data-dividertheme="b" data-inset="false"> 
     <li>Internal Panel</li> 
     <li data-icon='false'><a href="#"><i class='lIcon fa fa-coffee'></i>Need a Coffee</a></li> 
     <li data-icon='false'><a href="#"><i class='lIcon fa fa-beer'></i>Have a Beer</a></li> 
     <li data-icon='false'><a href="#"><i class='lIcon fa fa-music'></i>Play Music</a></li> 
     <li data-icon='false'><a href="#"><i class='lIcon fa fa-fire'></i>Make a fire</a></li> 
    </ul> 
    </div> 
    <!-- /panel --> 
    <div data-role="header" data-theme='b'> 
    <h1>Single page</h1> 
    </div> 
    <!-- /header --> 

    <div role="main" class="ui-content"> 
    <a href="#externalPanel" data-theme="b" data-role="button">Open EXTERNAL panel</a> 
    <a href="#internalPanel" data-theme="b" data-role="button">Open INTERNAL panel</a> 

    <p>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea 
     takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores 
     et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.</p> 
    </div> 
    <!-- /content --> 

</div> 
<!-- /page --> 

Answer 1

同様の問題を抱えている - ソリューションは、次のとおりです。パネルはページから継承するため

はbodyタグにクラスui-page-theme-bを追加します。

オマールは彼のコメントでこれを私に話し、答えとして自分自身で投稿することを勧めました。