日期:2014-05-16  浏览次数:20294 次

找个特效——点击后筛选
类似于MIUI下载的页面选择

点击“品牌”,下方会筛选出对应条件的内容

页面地址:http://www.miui.com/getrom.php

网上各种特效找了一圈没发觉,给个链接看看就好~

------解决方案--------------------


<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js"></script>
  <div id="ts" > 
     <a href="#" id=""  >全部</a>
     
    <a href="#" id="A" >A</a> <a href="#" id="B">B</a> <a href="#" id="C">C</a> <a href="#"  id="D">D</a>
  <div>
  
 <div id="pros" >
 
 <div id="A" > 
   <h3>A</h3>
    123456789
 </div>
 
  <div id="B" > 
   <h3>B</h3>
    q123456
 </div>
  <div id="C" > 
   <h3>C</h3>
    zxcvb
 </div>
  <div id="D" > 
   <h3>D</h3>
    sdslkjhgfd
 </div>
 
</div>
 <script>
  $(function(){
  $('#ts a').click(function(){
  $('#pros >div').hide();
  $('#pros '+(this.id?'#'+this.id:'>div') ).show();
  })
  })
 
 </script>