CODEWITHSUNDEEP
jquery
Vishal Panchal
Vishal Panchal

Reputation: 90

Unable to animate with insertBefore jQuery

I am using HTML5 list. I want to add new 'li' dynamically with animation.I have used an insertBefore function.Any idea how can I animate list with slide effect(Horizontal widget list).

Upvotes: 0

Views: 266

Answers (2)

Dhaval Pankhaniya
Dhaval Pankhaniya

Reputation: 1996

try this

little bit modification in @Bhargav's answer

hope it will help :)

$("<li style='display:none'>Test</li>").insertBefore(".inner").slideDown();
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<ul class="container">
  <li>Greetings</li>
  <li class="inner">Hello</li>
  <li class="inner">Goodbye</li>
</ul>

Upvotes: 1

Bhargav Chudasama
Bhargav Chudasama

Reputation: 7171

try with updated answer

$("<li>Test</li>").insertBefore(".inner").hide().toggle('slide');
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<ul class="container">
  <li>Greetings</li>
  <li class="inner">Hello</li>
  <li class="inner">Goodbye</li>
</ul>

Upvotes: 1

Related Questions