2012-06-29 1 views
0

이것은 dojo1.7 layout acting screwy의 연속입니다.버전 1.7에 대한 dojo 레이아웃 학습서가 작동하지 않습니다.

그래서 일부 위젯을 만들고 테스트 해 보았습니다. 그런 다음 http://dojotoolkit.org/documentation/tutorials/1.7/dijit_layout/의 튜토리얼을 사용하여 작업을 변경하여 레이아웃을 멋지게 만들려고했습니다. 여러 가지 흥미로운 방법으로 실패한 후 (따라서 마지막 질문) 나는 새로운 길에서 시작했다. 내 계획은 이제 레이아웃 자습서 예제를 구현하고 내 위젯에 충실합니다. 어떤 이유로 든 자습서는 작동하지 않을 것입니다 ... 모든로드가 사라지고 난 빈 브라우저 창으로 남았습니다.

아이디어가 있으십니까?

브라우저 호환성 문제가 될 수 있다는 사실을 알게 된 것은 Firefox 13.0.1입니다.

HTML :

<body class="claro"> 
<div 
     id="appLayout" class="demoLayout" 
     data-dojo-type="dijit.layout.BorderContainer" 
     data-dojo-props="design: 'headline'"> 
    <div 
      class="centerPanel" 
      data-dojo-type="dijit.layout.ContentPane" 
      data-dojo-props="region: 'center'"> 
     <div> 
      <h4>Group 1 Content</h4> 
      <p>stuff</p> 
     </div> 
     <div> 
      <h4>Group 2 Content</h4> 
     </div> 
     <div> 
      <h4>Group 3 Content</h4> 
     </div> 
    </div> 
    <div 
      class="edgePanel" 
      data-dojo-type="dijit.layout.ContentPane" 
      data-dojo-props="region: 'top'"> 
       Header content (top) 
    </div> 
    <div 
     id="leftCol" class="edgePanel" 
     data-dojo-type="dijit.layout.ContentPane" 
     data-dojo-props="region: 'left', splitter: true"> 
      Sidebar content (left) 
    </div> 
</div> 
</body> 

도장 구성 :

var dojoConfig = { 
     baseUrl: "${request.static_url('mega:static/js')}", //this is in a mako template 
     tlmSiblingOfDojo: false, 
     packages: [ 
      { name: "dojo", location: "libs/dojo" }, 
      { name: "dijit", location: "libs/dijit" }, 
      { name: "dojox", location: "libs/dojox" }, 
     ], 
     parseOnLoad: true, 
     has: { 
       "dojo-firebug": true, 
       "dojo-debug-messages": true 
      }, 
     async: true 
    }; 

다른 지금까지 내가 도장을 알고있는 몇 가지 코드를 가지고, 어쨌든 ...이와 호환되도록

을 생각한다 js 자료 :

require(["dijit/layout/BorderContainer", "dijit/layout/TabContainer", 
    "dijit/layout/ContentPane", "dojo/parser"]); 

CSS :

html, body { 
height: 100%; 
margin: 0; 
overflow: hidden; 
padding: 0; 
} 

#appLayout { 
height: 100%; 
} 
#leftCol { 
width: 14em; 
} 
+1

방화 광에서 흥미로운 것이 있습니까? 'packages' config 옵션의 마지막 인수에서','를 제거해야합니다. – maialithar

+0

흥미로운 점은 모든 div가 있고 오류가 표시되지 않았고 일치하지 않는 태그가 없다는 것입니다. 나는 그 쉼표를 꺼냈다. 고마워. – Sheena

+0

페이지가로드되면 소스를 볼 수 있습니까? 어쩌면 그것은 CSS 문제일까요? 'class' 속성을 삭제하려고 시도하십시오. 나는 당신이'claro' 테마에 대한 적절한 CSS 선언을 추가했다고 믿습니다. 튜토리얼의 레이아웃은 firefox aurora 15에서 dojo 1.7.2와 잘 작동합니다. - 나는 내 자신의 경험으로 그것을 보장 할 수 있습니다.) – maialithar

답변

0

나는 튜토리얼 페이지에서 '완전한 데모를'보고 제안하고 예에 코드를 비교하기 위해 불을 지르고를 사용합니다. 종종 그들은 추가 'demo.css'파일 또는 실제로 모든 것을 결합하는 데 필요한 다른 것을 제거합니다.

관련 문제