1

タイトルペインにタブ コンテナーを配置すると、どのブラウザーでも奇妙に見えますが、dojo v1.6 を使用すると完全に表示されます。コードを 1.8.4 に移植しているときに、ここで何か間違ったことをしていますか、それともそれ以降のバージョンで何かが壊れていますか?

このコードで Dojo のバージョンを変更して、違いを確認してください。

 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> 
  <html>  
  <head> 
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> 
    <!--The viewport meta tag is used to improve the presentation and behavior of the samples 
      on iOS devices-->
    <meta name="viewport" content="initial-scale=1, maximum-scale=1,user-scalable=no"/>
    <title> 
    </title> 

    <link rel="stylesheet" type="text/css" href="http://ajax.googleapis.com/ajax/libs/dojo/**1.6**/dijit/themes/claro/claro.css">    
    <style type="text/css"> 
      html, body { height: 100%; width: 100%; margin: 0; padding: 0; }
      #map{
        padding:0;
      }
    </style> 

    <script type="text/javascript"> 
      var djConfig = {
        parseOnLoad: true
      };
    </script> 

    <script src="http://ajax.googleapis.com/ajax/libs/dojo/1.6/dojo/dojo.js"></script>

    <script type="text/javascript"> 
      dojo.require("dijit.dijit"); // optimize: load dijit layer
      dojo.require("dijit.layout.BorderContainer");
      dojo.require("dijit.layout.ContentPane");
      dojo.require("dijit.TitlePane");
      dojo.require("dijit.layout.TabContainer");
      //require(["dojo/dnd/move", "dojo/_base/declare", "dojo/dom-construct", "dijit/layout/TabContainer", "dijit/TitlePane", "dijit/layout/BorderContainer", "dojox/layout/ExpandoPane", "dojo/domReady!"]);
    </script> 

  </head> 

  <body class="claro"> 
    <div dojotype="dijit.layout.BorderContainer" design="headline" gutters="false" style="width:100%;height:100%;margin:0;">
        <div dojotype="dijit.layout.ContentPane" region="center" style="width:500px;height:500px; border:1px solid #000;padding:0;">
       <div style="position:absolute;width:500px;height:500px; left:30px; top:10px; z-Index:999;">

       <div id="titlepane" dojoType="dijit.TitlePane" title="Show Tabs" closable="false"  open="false">
              <div id="tabContainer" dojoType="dijit.layout.TabContainer" style="width:100%; height:100%">
                <div id="one" dojoType="dijit.layout.ContentPane" title="Tab 1" selected="true">
                  Tab 1 content
                </div>
                <div id="two" dojoType="dijit.layout.ContentPane" title="Tab 2">
                  Tab 2 content
                </div>
                <div id="three" dojoType="dijit.layout.ContentPane" title="Tab 3">
                  Tab 3 content
                </div>
              </div>
        </div>
        </div>
        </div>
    </div>
  </body>
  </html>
4

1 に答える 1