I am attempting to activate an anchor link in my header without success. I understand that accordion overrides the href in the header. But can I somehow bind an event to launch this link.
I am trying to launch the following href in my headers which moves a map in the background while also expanding the accordion.
<a data-control="layer" href="#guilded">
This link works fine outside of the header, but not in it.
I've been trying to find a solution for days now. Any advice would be appreciated.
Here is the code of my page....
<!doctype html>
<html lang="en">
<head>
<script src="ext/jquery.min.js"></script>
<script type="text/javascript" src="ext/ui.core.js"></script>
<script type="text/javascript" src="ext/ui.resizable.js"></script>
<script type="text/javascript" src="ext/ui.accordion.js"></script>
<script type="text/javascript">
$(function() {
$("#accordion").accordion({
header: "h3",
navigation: true,
fillSpace: true
});
});
</script>
</head>
<body>
<div id="accordion">
<div>
<h3><div class="accordionButton"><a href="#">Tour One</a></div></h3>
<div class="accordionContent">
<p>The content of the first accordion menu</p>
</div>
</div>
<div>
<h3><div class="accordionButton"><a data-control="layer" href="#guilded">Tour Two</a></div></h3>
<div class="accordionContent">
<p>The content of the first accordion menu.</p>
</div>
</div>
</div>
<div id="map" class="map"></div>
</body>
</html>