Posted By

wildpeaks on 11/30/10


Tagged

virtualearth bingmaps


Versions (?)

Who likes this?

1 person have marked this snippet as a favorite

wildpeaks


Bing Maps AJAX control 7.0: Better-looking NavBar (Dashboard) and Map.setView padding


 / Published in: CSS
 

URL: http://www.wildpeaks.com

Important: this snipplet has moved to Github.

Moves the NavBar "outside" of the map so that it doesn't interfer with Map.setView and adds a subtle shadow on the NavBar and its dropdown menus.

Bing Maps AJAX 7.0 Control API Reference

  1. #YourMapContainer {
  2. overflow: hidden;
  3. }
  4.  
  5. #YourMapContainer .MicrosoftMap {
  6. overflow: visible !important;
  7. margin-top: 30px !important;
  8. background: none !important;
  9. }
  10.  
  11. #YourMapContainer .MicrosoftMap .NavBar {
  12. width: 100%;
  13. top: -30px;
  14. -moz-box-shadow: 0px 0px 4px #000;
  15. -webkit-box-shadow: 0px 0px 4px #000;
  16. box-shadow: 0px 0px 4px #000;
  17. -ms-filter: "progid:DXImageTransform.Microsoft.Shadow(Strength=3, Direction=180, Color='#888888')";
  18. filter: progid:DXImageTransform.Microsoft.Shadow(Strength=3, Direction=180, Color='#888888');
  19. }
  20.  
  21. #YourMapContainer .NavBar_zoomDrop, #YourMapContainer .MicrosoftMap_NavBar_typeMenu {
  22. -moz-box-shadow: 0px 3px 3px rgba(0, 0, 0, 0.5);
  23. -webkit-box-shadow: 0px 3px 3px rgba(0, 0, 0, 0.5);
  24. box-shadow: 0px 3px 3px rgba(0, 0, 0, 0.5);
  25. border: 1px solid #aaaaaa;
  26. border-top: none;
  27. }

Report this snippet  

You need to login to post a comment.