0

I have a declarative floating pane. onClick of a button i need to show up the floating pane. i have floating pane's width, height, left and top in declarative code, as well as while opening the pane also am setting all style attributes dynamically using script. The issue is, It's not taking the given style attributes. while rendering, its taking some dynamic left, top, width and height of its own. how to resolve this?

Code:

<div data-dojo-type="dojox.layout.FloatingPane" id="circuitsFloatingPane" title="Circuits"  data-dojo-props="resizable:true, dockable:false, title:'Circuits', closable:false" style="position:fixed;top:0px;left:10px;width:822px; height:495px;visibility:hidden; z-index: 1000;">
 </div>



function popUpCircuit(){
    document.getElementById('circuitsFloatingPane').style.width = "822px";
    document.getElementById('circuitsFloatingPane').style.height = "495px";
    document.getElementById('circuitsFloatingPane').style.left = "10";
    document.getElementById('circuitsFloatingPane').style.top = "0px";
    document.getElementById('circuitsFloatingPane').style.zIndex = "1000";
    dijit.byId('circuitsFloatingPane').show();
 }
user2941293
  • 21
  • 4

1 Answers1

0

From the docs

Always specify position:absolute in the style attribute, and always specify values for the ‘top’ and ‘left’ CSS attributes. Not doing so will cause FloatingPane to malfunction.

Matt R
  • 724
  • 5
  • 14