如何在dojo中设置浮动窗格的位置？

我创建了一个简单的浮动窗格声明（下面的代码）。一切都很好。我有一个点击它的按钮，浮动窗格将打开。问题是，如果我再次点击按钮，浮动窗格的位置是从以前的位置改变。我如何设置浮动窗格的位置。另一个问题是顶部，左侧和位置：绝对不适用于我的浮动窗格。 enter image description here 如何在dojo中设置浮动窗格的位置？

<body class="claro" role="main"> 

<div id="bc" style="width:100%; height:100%; padding: 5px;" dojoType="dijit.layout.BorderContainer"> 
    <div id="header" dojoType="dijit.layout.ContentPane" region="top" splitter="true"> 

    </div> 

    <div dojoType="dojox.layout.ExpandoPane" 
     splitter="true" 
     duration="125" 
     region="left" 

     previewOnDblClick="true" 
     id="leftPane" 
     maxWidth="275" 
     style="width: 275px;"> 
     <div dojoType="dijit.layout.TabContainer" attachParent="true" tabPosition="bottom" tabStrip="true"> 
      <div dojoType="dijit.layout.ContentPane" title="Legend"> 

       <div id="legendDiv"></div> 
      </div> 
      <div dojoType="dijit.layout.AccordionContainer" title="Search" style="width:275px;" attachParent="true"> 
       <div dojoType="dijit.layout.ContentPane" title="Attribute search"> 
        <div class="searchBar"> 
         <p> 
          <label for="searchBox" style="float: left;">Search:</label> 
          <input id="searchBox" name="searchBox" style="float: left;"> 
           <span id="runSearchIcon" style="border: none; floast: left; padding: 3px;"> 

           </span> 
         </p> 
        </div> 
        <ul id="dojoList"></ul> 
       </div> 
       <div dojoType="dijit.layout.ContentPane" title="spatial search"> 
        <ul id="dijitList"></ul> 
       </div> 

      </div> 

     </div> 
    </div> 
    <div dojoType="dijit.layout.ContentPane" region="center" id="centerPane" tabStrip="true"> 

     <div id="mymap" style="width:100%;height:100%"> </div> 








     <div data-dojo-type="dojox.layout.FloatingPane" id="dFloatingPane" 
      title="A floating pane" data-dojo-props="resizable:false, dockable:true,closable:false, title:'Tools'" 
      style="position:absolute;top: 100px;;left:0;width:70px;height:150px;visibility:hidden;"> 
      This is the content of the pane! 
     </div> 

     <div data-dojo-type="dijit.form.Button" data-dojo-props="label:'Show me', onClick:function(){dijit.byId('dFloatingPane').show();}" style="position:absolute;top: 150px;left: 20px;"></div> 

    </div> 
</div> 

</div> 
</body>

来源

2015-07-12 wetland

简单的解决方案只是创建一个div和相对位置时，位置相对控制绝对的，这里是示例代码如。检查和了解

<div style="position:relative"> 
     <div data-dojo-type="dojox.layout.FloatingPane" id="dFloatingPane" 
     title="A floating pane" data-dojo-props="resizable:false, dockable:true,closable:false, title:'Tools'" 
     style="position:absolute; top: 100px; left:0; width:70px;height:150px; visibility:hidden;"> 
     This is the content of the pane! 
    </div> 

    <div data-dojo-type="dijit.form.Button" data-dojo-props="label:'Show me', onClick:function(){dijit.byId('dFloatingPane').show();}" style="position:absolute;top: 150px;left: 20px;"></div> 

    </div>

位置：相对控制的位置是：绝对的，所以你可以accordign设置顶部或底部位置你dessign thanku，希望你能理解我的观点。

来源

2015-07-12 17:45:32

谢谢，但它没有奏效。你尝试过吗？ – wetland

是这个规则是工作，给我发送链接我会解决你的问题 –

我编辑了我的代码。这是我的全身代码 – wetland

最简单的方法是通过使用domStyle将按钮上的每次单击设置到第一个位置来设置位置：absolut。

 domStyle.set("dFloatingPane",{ 
       position:"absolute", 
       top:"100px", 
       left:"0px" 
      });

来源

2015-07-13 10:17:40 MiBrock

如何在dojo中设置浮动窗格的位置？

回答

相关问题