Как создать всплывающее окно в Google Maps с помощью плагина Jquery или Jquery?

Question

Когда вы используете Карты Google, вы нажимаете маркер на карте, после чего появляется всплывающее окно. Вы даже можете ввести номер своего мобильного телефона и получить смс от Google. Как создать это всплывающее окно с помощью плагина Jquery или Jquery?

Answer 1

Я предполагаю, что Карты Google - это всего лишь пример желаемого эффекта, а не основы вашего проекта:

Это на самом деле не более, чем показ определенного div и последующее его скрытие.

$("a.popup1").click(function(e){
  e.preventDefault();
  $("div.popup1").toggle();
});

-

<a class="popup1" href="enable-javascript.html">Show Popup</a>
<div class="popup1"><p>This is where your data goes.</p></div>

-

Если Google Maps на самом деле является базой вашего проекта, я бы посоветовал проверить jMaps , плагин jQuery для Google Maps. Примеры добавления Markers и pointHTML (те окна, о которых вы говорите) можно найти здесь: http://github.com/digit...Google.Markers.AddMarker.html

Answer 2

Есть все виды вариаций, но в основном вы будете делать:

1. чтобы начать, добавьте div к документу (или к некоторому элементу контейнера, в зависимости от того, как выглядит ваш сайт)
2. запустить транзакцию AJAX, чтобы получить контент для вашего маленького всплывающего окна (если его там уже нет на скрытой странице)
3. дайте div, соответствующий CSS, вы хотите, чтобы атрибуты класса стилировали его так, как вы хотите (важно, чтобы он был видимым: -)

Среди вещей, которые должно содержать ваше всплывающее окно, - кнопка или какой-либо другой элемент управления, позволяющий удалить его. Вы можете использовать функцию jQuery offset (), чтобы найти позицию на странице чего-то, по которой щелкнули, и затем информацию о положении (верхний левый угол) можно использовать для позиционирования вашего плавающего элемента. Ваш плавающий элемент, вероятно, должен быть позиционирован с абсолютным позиционированием и иметь значение "z-index", которое больше, чем окружающий контент.

Как именно вы это делаете, во многом зависит от того, как выглядит ваш сайт, как размещается и позиционируется другой контент, и как вы получаете / синтезируете контент всплывающих окон.