javascript - Slidetoggle 2 adjacent divs -
<div class="unique1">blabla1</div> <div class="amministrazione">amministrazione</div> <a href="">some link</a> <a href="">some link</a> <div class="didattica">didattica</div> <a href="">some link</a> <div class="unique2">blabla2</div> <div class="amministrazione">amministrazione</div> <a href="">some link</a> <div class="didattica">didattica</div> <a href="">some link</a> <a href="">some link</a> <div class="unique3">blabla3</div> <div class="amministrazione">amministrazione</div> <div class="didattica">didattica</div> <div class="unique4">blabla4</div> <div class="amministrazione">amministrazione</div> <div class="didattica">didattica</div> <a href="">some link</a> i'd have .amministrazione, .didattica , links on display:none default. when user clicks on .unique1 or .unique2 or .unique3 or .unique4 (only) next .amministrazione , .didattica slidetoggle down.
here's have far.. it's not toggling correct elements:
jquery(function () { jquery('.unique1, .unique2, .unique3, .unique4').click(function () { var index = $(this).index(), newtarget = jquery('.amministrazione, .didattica').eq(index).slidedown(); jquery('.amministrazione, .didattica').not(newtarget).slideup(); }); });
use nextall :first selector target appropriate divs:
jquery(function () { jquery('.unique1, .unique2, .unique3, .unique4').click(function () { jquery('.amministrazione, .didattica').slideup(); jquery(this).nextall('.amministrazione:first, .didattica:first').stop().slidedown(); }); }); accomplish same thing using
nextuntil: jquery(function () { var un= jquery('.unique1, .unique2, .unique3, .unique4'); un.click(function () { jquery('.amministrazione, .didattica, a').slideup(); jquery(this).nextuntil(un).stop().slidedown(); }); });
Comments
Post a Comment