Seeking help with enhancing my jQuery dropdown menu to include a slide down toggle effect similar to this example: http://jsfiddle.net/LaSsr/188/. Any assistance in applying this slide effect to the following JSfiddle would be greatly appreciated. Thank you :)
JSFIDDLE
https://jsfiddle.net/6mWZa/182/
(function($, undefined) {
var open = [];
var opts = {
selector: '.dropdown',
toggle: 'dropdown-toggle',
open: 'dropdown-open',
nest: true
};
$(document).on('click.dropdown touchstart.dropdown', function(e) {
// Close the last open dropdown if click is from outside the target dropdown
if (open.length && (!opts.nest || !open[open.length - 1].find(e.target).length)) {
open.pop().removeClass(opts.open);
}
var $this = $(e.target);
// If target is a dropdown then toggle it...
if ($this.hasClass(opts.toggle)) {
e.preventDefault();
$this = $this.closest(opts.selector);
if (!$this.hasClass(opts.open)) {
open.push($this.addClass(opts.open));
} else {
open.pop().removeClass(opts.open);
}
}
});
})(jQuery);<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="language" class="dropdown">
<a href="#language" class="dropdown-toggle">English</a>
<div class="dropdown-menu">
<div class="dropdownCool">
Hello1
</div>
</div>
</div>
<div id="locale" class="dropdown">
<a href="#locale" class="dropdown-toggle">
London</a>
<div class="dropdown-menu">
<div class="dropdownCool">
Hello2
</div>
</div>
</div>