nav[aria-label="Primary Navigation"] { padding: 0; & ul { list-style: none; width: 100%; display: flex; flex-direction: row; justify-content: start; align-items: start; gap: 30px; padding: 0; & li { margin: 0; } & ul li { list-style: none; } } }

What is the equivalent of a FloatingPanel control

Hi all

In Dojo how do you use to replace the old Web ADF FloatingPanel control?

thanks

Vind meer berichten getagd met

Accepted answers

All comments

Hi Jose,

I believe the 'dojox.layout.FloatingPane' is similar. Here is an example:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> 
<html> 
  <head> 
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> 
    <meta http-equiv="X-UA-Compatible" content="IE=7" /> 
    <meta name="viewport" content="initial-scale=1, maximum-scale=1,user-scalable=no"/> 
    <title></title>   
    <link rel="stylesheet" type="text/css" href="http://serverapi.arcgisonline.com/jsapi/arcgis/3.2/js/esri/css/esri.css">
    <link rel="stylesheet" type="text/css" href="http://serverapi.arcgisonline.com/jsapi/arcgis/3.2/js/dojo/dojox/layout/resources/FloatingPane.css">
    <link rel="stylesheet" type="text/css" href="http://serverapi.arcgisonline.com/jsapi/arcgis/3.2/js/dojo/dojox/layout/resources/ResizeHandle.css">
    <link rel="stylesheet" href="css/claro.css" type="text/css" media="screen" title="no title" charset="utf-8"/>    
    <script type="text/javascript">var dojoConfig = {parseOnLoad: true};</script> 
    <script type="text/javascript" src="http://serverapi.arcgisonline.com/jsapi/arcgis/?v=3.2"></script> 
    <script type="text/javascript">
        dojo.require("dijit.layout.BorderContainer"); 
        dojo.require("dijit.layout.ContentPane"); 
        dojo.require("dojox.layout.FloatingPane");
        dojo.require("esri.map"); 

        var map;
        
        function init() {
            var initialExtent = new esri.geometry.Extent({"xmin":-8396836.868209211,"ymin":4835062.442691721,"xmax":-8328196.416809216,"ymax":4891396.53253782,"spatialReference":{"wkid":102100}});
            map = new esri.Map("mapDiv", {extent: initialExtent})
            var baseMap = new esri.layers.ArcGISTiledMapServiceLayer("http://server.arcgisonline.com/ArcGIS/rest/services/World_Street_Map/MapServer");
            
            map.addLayer(baseMap);
           
            dojo.connect(map, "onLoad", function(theMap){
                dojo.connect(dijit.byId('mapDiv'), 'resize', map, map.resize);
            }); 
          } 
          
        function showMap() {
          if (!map) {
              init();
          }
        }
             
        dojo.addOnLoad(init);
    </script> 
  </head> 
   
  <body class="claro"> 
   <div data-dojo-type="dijit.layout.BorderContainer" data-dojo-props="design:'headline'"  style="width: 100%; height: 100%; margin: 0;"> 
    <div id="floater" dojoType="dojox.layout.FloatingPane"  title='Map' dockTo="dock" closable="false" resizable="true"  dockable="true" > 
      <div id="mapDiv" data-dojo-type="dijit.layout.ContentPane" style="height:100%;width:100%;">
          <input type="button" value="Show Map" onclick="showMap()" />
      </div>       
    </div>
   </div>
  </body> 
</html>

Doe mee aan het gesprek

Aangemelde leden kunnen berichten plaatsen, updates volgen en meer. Nieuw hier? Registreer een gratis account.

Snelle Links

Community Help
Find useful guides, FAQs, and documents to help you navigate and make the most of Esri Community.