Reputation: 37
I want to slide toggle my menu when someone clicks i
which i added from fontawesome but it doesnt work i tried everything
$(document).ready(function() {
$('.fa-beer').click(function() {
$('#aa').slideToggle(fast);
})
})
#aa {
position: absolute;
width: 230px;
height: 100%;
color: white;
background: green;
display: none;
}
#aa ul li {
padding: 12px;
text-align: center;
border-bottom: 1px solid white;
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<i class="fas fa-beer">Click</i>
<div id="aa">
<ul>
<li>Maain</li>
<li>Maain</li>
<li>Maain
<ul>
<li>maain 2</li>
</ul>
</li>
<li>Maain</li>
<li>Maain</li>
</ul>
</div>
Upvotes: 0
Views: 37
Reputation: 6755
In your code fast
should be around quotes.
other than that your code is perfect.
$(document).ready(function() {
$('.fa-beer').click(function() {
$('#aa').slideToggle("fast");
})
})
#aa {
position: absolute;
width: 230px;
height: 100%;
color: white;
background: green;
/*display: none;*/
}
#aa ul li {
padding: 12px;
text-align: center;
border-bottom: 1px solid white;
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<i class="fas fa-beer">toggle</i>
<div id="aa">
<ul>
<li>Maain</li>
<li>Maain</li>
<li>Maain
<ul>
<li>maain 2</li>
</ul>
</li>
<li>Maain</li>
<li>Maain</li>
</ul>
</div>
Upvotes: 1