Создание стиля меню как у maps.google.com

У меня есть вот такая карта:

введите сюда описание изображения

которая растянута на полный размер экрана. Сделано это таким образом:

В html:

...

<div class="row">
    <div class="col-md-12">
        <div class="map-wrapper">
            <div id="mapId"></div>
        </div>
    </div>
</div>

...

В js

$(window).on("resize", function () {$("#mapId").height($(window).height());}).trigger("resize");

Все работает так, как я хотел - карта растянута под полный размер экрана. И вот тут появляется задача: нужно установить в левый угол карты меню, стилистикой как у Google Maps:

введите сюда описание изображения

Тут мы видим, что это меню как будто левитирует на карте, не привязываться ни к какому из сторон. Также, данное меню может скрывать содержимое и раскрывать, по нажатию на стрелку. Моя задача, создать что то подобное, если возможно, используя Bootstrap

В данное меню я хочу установить ссылки на различные ресурсы, так как не хочу создавать Navbar для этого. Хочу, что бы карта была именно на весь размер экрана...


Ответы (0 шт):