Question

I have the following node structure in my HTML:

<div id="widget1" class="dojoxFloatingPane dijitContentPane dojoxFloatingPaneFg" title=""     role="group" style="position: absolute; top: 82px; left: 231px; width: 984px; height: 276px; z-index: 102;" widgetid="widget1">
<div class="dojoxFloatingPaneTitle" dojoattachpoint="focusNode" role="button" tabindex="0">
<div class="dojoxFloatingPaneCanvas" dojoattachpoint="canvas" style="left: 0px; top: 0px; width: 984px; height: 249px;">
<iframe class="dijitBackgroundIframe" src="javascript:""" role="presentation" style="opacity: 0.1; width: 100%; height: 100%;" tabindex="-1">

I’m trying to set the size of this FloatingPane with Dojo with the following peace of code. First I read in the nodes, the widget1 node and then I look for the dojoxFloatingPaneTitle class and store these nodes in variables. Then I read the cookie and it successfully sets the style on the paneNode.

            var paneNode = dom.byId("widget1");
            var canvasNode = query(".dojoxFloatingPaneCanvas", paneNode);               

  function(){
                    var wid1saved = dojo.fromJson(cookie("widget1"));
                    domStyle.set(paneNode, {
                        left: wid1saved.x + "pt",
                        top: wid1saved.y + "pt", 
                        width: wid1saved.w + "px", 
                        height: wid1saved.h + "px",
                        position: "absolute"
                    });
                    domStyle.set(canvasNode, {
                        width: wid1saved.w + "px",
                        height: wid1saved.h + "px",
                        backgroundColor: "black"
                    });
                }

It does set the size of the outer node (paneNode) but the canvas inside (canvasNode) is unchanged. In the debugger I can see that the query does find the proper node.
Any ideas why the canvasNode style is not set?

Many thanks

Answer 1

dojo.query usually returns an array of the objects found.

Have you tried:

var canvasNode = query(".dojoxFloatingPaneCanvas", paneNode)[0];