jQuery Fading Slide Menu

fiddle.css

#toggleEl {
  display:none;
}

nav[role="navigation"] ul {
  padding-left:0;
}

nav[role="navigation"] li {
  list-style-type:none;
  padding:0.5em;
  display:block;
  width:100%;
  margin-left:0;
  border:1px solid black;
}

fiddle.html

<a id="clickedEl"><span>Click Me</span></a>
<nav role="navigation" id="toggleEl">
	<ul>
  		<li><a href="#">Item 1</a></li>
  		<li><a href="#">Item 2</a></li>
  		<li><a href="#">Item 3</a></li>
	</ul>
</nav>

fiddle.js

$(function(){
	$('#clickedEl').fadingSlideToggle('#toggleEl');
});

fiddle.manifest

name: jQuery Fading Slide Toggle
description: Adding fading capability to slideUp/slideDown
authors:
- Don Walter
resources:
- https://raw.github.com/donwalter/jquery-fading-slide-toggle/master/jquery.fadingslidetoggle.js
normalize_css: no