我以声明方式创建了一个简单的 float Pane (以下代码)。一切都很好。我有一个单击它的按钮, float Pane 将打开。问题是,如果我再次单击该按钮, float Pane 的位置就会从以前的位置发生变化。我如何设置 float Pane 的位置。另一个问题是顶部、左侧和position:absolute不适用于我的 float Pane 。
<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>
最佳答案
最简单的方法是使用 domStyle 将每次单击 Button 时的 position:absolut 设置为第一个位置。
domStyle.set("dFloatingPane",{
position:"absolute",
top:"100px",
left:"0px"
});
关于html - 如何在 dojo 中设置 float Pane 的位置?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/31370201/