Google Maps Control, чтобы двигаться соответственно

Question

По сути, я просто хочу скопировать http://maps.google.com. Я бы хотел использовать карты Google на «полный экран» и иметь плавающее меню, которое можно вставлять и выгружать.Однако, когда оно выдвинуто, элементы управления масштабированием должны «перемещаться соответствующим образом», а не скрываться за меню.

Изменить, чтобы уточнить: я хочу, чтобы Google Maps были на 100% на 100%, чтобы это работало.Я также хочу иметь наложение меню в верхнем левом углу (или только всю левую сторону) с возможностью скольжения внутрь и наружу.Однако в левой верхней части находится элемент управления масштабированием Карт Google, я не хочу, чтобы мое меню покрывало его, я хочу, чтобы оно «перемещалось», когда мое меню открыто.

Google делает это какхорошо на их веб-версии: http://maps.googl.com

Answer 1

вам нужно создать правильную настройку HTML. Например:

HTML

<div id="main-wrapper">
  <div id="left-menu-wrapper">
     <!-- code with navigation -->
     <a href="javascript:toggleMenu();"> Show / Hide </a>
  </div>
  <div id="google-window-wrapper">
     <!-- code to display google map here -->
  </div>
</div>

CSS

#main-wrapper {

}
#left-menu-wrapper{
    width:200px;
    float:left;
}
#google-window-wrapper{
    width:auto;
}

* Javascript 1014 * (используется для переключения блока меню)

var windowHidden = false;
function toggleMenu(){
    windowHidden = !windowHidden;
    document.getElementById("left-menu-wrapper").style.width = 
              (windowHidden) ? "0px" : "200px";
}

Это то, что вы ищете?