jquery - Slide Up on click -


i have several divs on page. on page load want first div visible 'show more' link. upon clicking 'show more', want load first three divs , on clicking second time want show all divs.

so far working fine. after show all, when span tag clicked, should slide , hide except first div i.e should reset divs on page load gives show more/show less effect.

here fiddle

try this

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.2/jquery.min.js">  </script>    <div class="offerscontainer">  <div class='pan-box'>a</div>  <div class='pan-box'>b</div>  <div class='pan-box'>c</div>  <div class='pan-box'>d</div>  <div class='pan-box'>e</div>  <span>show more</span>  </div>    <script>  $(".offerscontainer > div:gt(0)").hide();  var click = false;  var = 1;  $(".offerscontainer > span").click(function() {      if (i <= 2) {          $(this).siblings(click ? "div:gt(0)" : "div:lt(3)").slidedown();          click = true;      } else {          $(this).siblings("div:gt(0)").slideup();          click = false;          = 0;      }        i++;  });  </script>


Comments

Popular posts from this blog

sql - invalid in the select list because it is not contained in either an aggregate function -

Angularjs unit testing - ng-disabled not working when adding text to textarea -

How to start daemon on android by adb -