kartofili
kartofili

Reputation: 37

slideToggle() function doesn't do anything

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

Answers (1)

Syed mohamed aladeen
Syed mohamed aladeen

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

Related Questions