javascript - Reorder elements with jquery -
i have div kid divs aligned 3 in row. kid div's css:
{position:relative,float:left} i utilize jquery snippet this:
$("#catalog-body").find("[data-"+ type +"='" + val + "']").hide(); it works well, may cause gaps in rows(in place of hidden divs). how create divs realign? in advance.
change element construction this.
<html> <head> <style> #catalog-body{ width : 300px; } .child-ele { float:left; width:90px; height:30px; border:1px reddish solid; } </style> </head> <body> <div id="catalog-body" > <div class="child-ele" >1</div> <div class="child-ele" >2</div> <div class="child-ele" >3</div> <div class="child-ele" >4</div> <div class="child-ele" style="display:none" >5</div> <div class="child-ele" >6</div> <div class="child-ele" >7</div> <div class="child-ele" >8</div> <div class="child-ele" >9</div> <div class="child-ele" >10</div> </div> </body> </html> this result should get,
5th element hidden childrens align properly
javascript jquery css
No comments:
Post a Comment