JSFiddle - React, Tailwind, and code Playground
by brightonmike
HTML
<link rel="stylesheet" href="http://shokadu.co.uk/wp-content/themes/sc/style.css">
<div id="leftcontent">
<h3>Information</h3>
<div id="accordion">
<h4><a class="mapclose" href="#"><span class="accordionspan">‣</span> Opening Hours</a></h4>
<div>
<p>Our handling team are available during airport opening hours:</p>
<p>Mon, Tues, Weds, Fri 0800-1830</p>
<p>Thurs 0800-1900</p>
<p>Sat, Sun 0900 - 1830</p>
</div>
<h4><a class="mapclose" href="#"><span>‣</span> FBO Facilities</a></h4>
<div>
<ul>
<li><span>Executive reception area</span></li>
<li><span>Free Wi-Fi</span></li>
<li><span>Re-fuelling</span></li>
<li><span>Aircraft Cleaning</span></li>
<li><span>Immigration/Customs</span></li>
<li><span>Car rental</span></li>
<li><span>Aircraft Cleaning</span></li>
<li><span>Immigration/Customs</span></li>
<li><span>Car rental</span></li>
</ul>
</div>
<h4><a class="mapclose" href="#"><span>‣</span> Airport Frequencies</a></h4>
<div>
<p>Approach 123.15</p>
<p>Tower 125.40</p>
<p>ATIS 125.30</p>
</div>
<h4><a href="#" onclick="initialize()"><span>‣</span> Location Map</a></h4>
<div>
<div id="map_canvas"></div>
</div>
</div>
</div>
<script type="text/javascript" src="//maps.googleapis.com/maps/api/js?sensor=false"></script>
<script type="text/javascript">
function initialize() {
var pinkParksStyles = [
{
stylers: [
{ visibility: "on" },
{ hue: "#FF3000" }
]
},{
featureType: "landscape.natural",
stylers: [
{ visibility: "on" },
{ hue: "#00ff33" },
{ lightness: 100 },
{ saturation: -100 }
]
},{
featureType: "transit",
stylers: [
{ visibility: "on" },
{ lightness: 100 },
{ saturation: 100 },
{ hue: "#FFFFFF" }
]
}
];
var pinkMapType = new...
JavaScript
$(document).ready(function(){
$(".mapclose").click(function(){
$("#map_canvas").empty();
});
});