如何将Bing地图菜单画面

我使用Bing地图API，它增加了一个菜单栏在屏幕的左上方的右侧：如何将Bing地图菜单画面

我想反映如何现在右边有一个酒吧，最右边的罗盘，下一个放大镜，以及下一个鸟眼菜单。当前的HTML是：

<div class="MicrosoftNav MapTypeId_be"> 
    <div class="OverlaysTL"> 
     <div class="NavBar_compassControlContainer"> 
      <a class="NavBar_button NavBar_toolButton NavBar_rotateLeft" href="#" title="Rotate left" uici="NB.CS.RotateLeft" style="visibility: hidden;"> 
      </a> 
      <a href="#" title="Click to pan in any direction" uici="NB.CS.PanControl" class="NavBar_compass NavBar_compassFlat">N</a> 
      <a class="NavBar_button NavBar_toolButton NavBar_rotateRight" href="#" title="Rotate right" uici="NB.CS.RotateRight" style="visibility: hidden;"></a> 
     </div> 
     <div class="NavBar_zoomControlContainer"> 
      <div class="NavBar_zoomDrop" style="position: absolute; display: none;"> 
       <div class="NavBar_zoom"> 
        <div class="NavBar_zoomBar" style="position: absolute; overflow: hidden;"> 
         <div class="NavBar_zoomBarBg"></div> 
         <div class="NavBar_zoomSlider" title="Move slider to zoom in or out" style="top: 97px;"></div> 
        </div> 
       </div> 
      </div> 
      <a class="NavBar_button NavBar_toolButton NavBar_zoomOut" href="#" title="Zoom out" uici="NB.ZC.ZoomOut"></a> 
      <a class="NavBar_button NavBar_toolButton NavBar_zoomIn" href="#" title="Zoom in" uici="NB.ZC.ZoomIn"></a> 
     </div> 
     <div class="NavBar_modeSelectorControlContainer"> 
      <span class="NavBar_separator"></span> 
      <span class="NavBar_button NavBar_typeButton"> 
       <a class="NavBar_typeButtonLabel NavBar_MapType_be" href="#">Bird's eye</a> 
       <span class="separator"></span> 
       <a class="NavBar_dropIconContainer" href="#"> 
        <span class="NavBar_dropIcon"></span> 
       </a> 
      </span> 
     </div> 
     <span style="display: block; height: 0px; width: 0px; line-height: 0; font-size: 0px; clear: both;"></span> 
    </div> 
    <span style="display: block; height: 0px; width: 0px; line-height: 0; font-size: 0px; clear: both;"></span> 
</div>

因此我尝试了以下CSS：

#map-canvas > div > div.MicrosoftNav.MapTypeId_be > div{ 
    right: 0; 
    position: absolute; 
}

这导致：

那么我有什么做的就是的镜子原版的？

来源

2016-03-22 Sara Tibbetts

从技术上讲，修改Bing地图控件的CSS是一种未经证实的/不受支持的破解，如果V7更新，破解可能会中断。所以通常这不被推荐。推荐的方法是隐藏默认导航栏并创建自定义控件并将其悬浮在地图上。

请注意，导航栏会根据显示的内容（即鸟眼，面包屑）向右扩展到正确的位置。如果你不关心那个，那么你可以使用下面的CSS，它将适用于除面包屑之外的所有东西：

.MicrosoftMap .OverlaysTL { 
    top: auto; 
    right: 348px; 
} 

.NavBar_compassControlContainer { 
    left: 240px; 
} 

.NavBar_zoomControlContainer { 
    left: 190px; 
} 

.NavBar_modeSelectorControlContainer { 
    left: 0px; 
} 

.MicrosoftNav .NavBar_separator { 
    position: absolute; 
    left: 180px; 
}

来源

2016-03-24 07:01:35 rbrundritt

如何将Bing地图菜单画面

回答

相关问题