Official JsFiddle Foundation 5.2.3

by Ritesh Kashyap

HTML

<script src="//cdnjs.cloudflare.com/ajax/libs/foundation/5.2.3/js/vendor/modernizr.js"></script>
<link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/foundation/5.2.3/css/foundation.min.css">
<script src="http://cdnjs.cloudflare.com/ajax/libs/foundation/5.2.3/js/foundation.min.js"></script>
<a data-dropdown="drop2" aria-controls="drop2" aria-expanded="false">Has Content Dropdown</a>
<div id="drop2" data-dropdown-content class="f-dropdown content" aria-hidden="true" tabindex="-1">
  <p>Some text that people will think is awesome! Some text that people will think is awesome! Some text that people will think is awesome!</p>
</div>

JavaScript

$(document).foundation('dropdown', 'reflow');
$('#drop2').foundation('dropdown');
$('#drop2').on("opened",function(){
alert('open');
})
$('#drop2').on("closed",function(){
alert('closed');
})