Each marker can have a bubble called an "info window" pop up when the user clicks on it. An info window can have any valid HTML and multiple tabs. One info window per map can be opened automatically as soon as the page loads, instead of waiting for the use to click on it.

Simple Info Windows

A

4D Development
World Headquarters
Fort Wayne, Indiana

B

New York

C

Chicago:

D

Los Angeles

Each <a> tag may be followed by a <div> tag that specifies more information for that marker. Almost any valid HTML is allowed, including images and other media (flash, quicktime, etc.)

Clicking on any of these markers will bring up an info window with a bit more information.

<div class="GMapEZ GSmallMapControl GSmallMapTypeControl"
    style="width: 300px; height: 300px;">
  <a href="http://maps.google.com/maps?ll=41.092104,-85.144740&amp;spn=0.006130,0.009795&amp;t=k&amp;hl=en">
    A
  </a>
  <div>
    4D Development<br />
    World Headquarters<br />
    Fort Wayne, Indiana
  </div>

  <a href="http://maps.google.com/maps?ll=40.755580,-73.937988&amp;spn=6.276505,5.552490&amp;hl=en">
    B
  </a>
  <div>New York</div>

  <a href="http://maps.google.com/maps?ll=41.877741,-87.637939&amp;spn=6.169597,5.552490&amp;hl=en">
    C
  </a>
  <div>
    Chicago:<br />
    <img src="chicago.jpg" alt="skyline" />
  </div>

  <a href="http://maps.google.com/maps?ll=33.916013,-118.179932&amp;spn=6.874500,5.552490&amp;hl=en">
    D
  </a>
  <div>Los Angeles</div>
</div>

Auto-open Info Windows

To have a marker's info window open by default, add the word OPEN to the text inside the marker's <a> tag. Google Maps can only show one info window at a time, so you should only specify one OPEN marker per map.

<div class="GMapEZ GSmallMapControl GSmallMapTypeControl"
    style="width: 300px; height: 300px;">
  <a href="http://maps.google.com/maps?ll=41.092104,-85.144740&amp;spn=0.006130,0.009795&amp;t=k&amp;hl=en">
    A OPEN
  </a>
  <div>
    4D Development<br />
    World Headquarters<br />
    Fort Wayne, Indiana
  </div>
</div>

Info Windows with Tabs

If you list more than one <div> tag after an <a> marker, your info window will get a notebook tab for each <div> (starting with GMapEZ 2.2). You can set the name of each tab by giving a title attribute in its <div> tag, as in this example:

<div class="GMapEZ GSmallMapControl GSmallMapTypeControl"
    style="width: 300px; height: 300px;">
  <a href="http://maps.google.com/maps?ll=41.092104,-85.144740&amp;spn=0.006130,0.009795&amp;t=k&amp;hl=en">
    A OPEN
  </a>
  <div title="Address">
    4D Development<br />
    World Headquarters<br />
    Fort Wayne, Indiana
  </div>
  <div title="Details">
    Plenty of room here to describe any
    details for this particular marker.
  </div>
</div>

Use Links to Open Markers

A

4D Development
World Headquarters
Fort Wayne, Indiana
See also Chicago

C

Chicago:

In this example, each <a> tag has an id attribute:

<div class="GMapEZ GSmallMapControl GSmallMapTypeControl"
    style="width: 300px; height: 300px;">
  <a id="hq" href="http://maps.google.com/maps?ll=41.092104,-85.144740&amp;spn=0.006130,0.009795&amp;t=k&amp;hl=en">
    A
  </a>
  <div>
    4D Development<br />
    World Headquarters<br />
    Fort Wayne, Indiana<br />
    See also <a href="#chi">Chicago</a>
  </div>

  <a id="chi" href="http://maps.google.com/maps?ll=41.877741,-87.637939&amp;spn=6.169597,5.552490&amp;hl=en">
    C
  </a>
  <div>
    Chicago:<br />
    <img src="chicago.jpg" alt="skyline" />
  </div>
</div>

The 4D Development and Chicago markers can then be opened from outside the map, like this:

The <a href="#hq">4D Development</a> and
<a href="#chi">Chicago</a> markers can be
then be opened from outside the map, like this:

Starting with 2.3 links to infoWindows can be used from inside other infoWindows, like the "see also" link in 4D Development above.

Continue the documentation with Advanced Topics.