---
layout: example.html
title: Overlay
shortdesc: Demonstrates overlays.
docs: >
  <p>The popups are created using <a href="http://getbootstrap.com/javascript/#popovers">Popovers</a> from Bootstrap.</p>
tags: "overlay, popup, bootstrap, popover"
resources:
  - https://code.jquery.com/jquery-2.2.3.min.js
  - https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css
  - https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js
---
<div id="map" class="map"></div>
<div style="display: none;">
  <!-- Clickable label for Vienna -->
  <a class="overlay" id="vienna" target="_blank" href="http://en.wikipedia.org/wiki/Vienna">Vienna</a>
  <div id="marker" title="Marker"></div>
  <!-- Popup -->
  <div id="popup" title="Welcome to OpenLayers"></div>
</div>