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

Finde mehr Beiträge mit dem Tag

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>

Nimm an der Diskussion teil

Angemeldete Mitglieder können Beiträge verfassen, Updates folgen und mehr. Neu hier? Registriere ein kostenloses Konto.

Schnellzugriffe

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