欢迎光临
我们一直在努力

jQuery等高排列插件怎么使用

这篇文章主要讲解了“jQuery等高排列插件怎么使用”,文中的讲解内容简单清晰,易于学习与理解,下面请大家跟着小编的思路慢慢深入,一起来研究和学习“jQuery等高排列插件怎么使用”吧!

  Filterizr 是一款筛选过滤jquery插件,它提供了多重筛选过滤方式,能够满足你的不同需求。并且使用了 CSS3 过滤效果,使用户体验更优秀。

  <link rel="stylesheet" href="">

  <script src=""></script>

  <script src=""></script>

  <div class="dowebok">

  <div class="filtr-item" data-category="1, 5">

  <img src="" alt="">

  </div>

  <div class="filtr-item" data-category="2, 5">

  <img src="" alt="">

  </div>

  <div class="filtr-item" data-category="1, 4">

  <img src="" alt="">

  </div>

  &hellip;

  </div>

  为标签加上 data-category 属性,用于指定分类 id,可以有多个分类,用都好“,”分开。

  如果需要在额外的标签中加入控制,需要用到其他的 data 属性,如:

  1)单选:

  <li data-filter="all">全部</li>

  <li data-filter="1">分类1</li>

  <li data-filter="2">分类2</li>

  <li data-filter="3">分类3</li>

  2)多选:

  <li data-multifilter="1">代码</li>

  <li data-multifilter="2">素材</li>

  <li data-multifilter="3">模板</li>

  3)排序:

  <li class="shuffle-btn" data-shuffle>随机</li>

  <li class="sort-btn" data-sortAsc>顺序</li>

  <li class="sort-btn" data-sortDesc>倒序</li>

  4)搜索:

  <input class="keyword" placeholder="请输入关键字" data-search>

  $('.dowebok')。filterizr();

感谢各位的阅读,以上就是“jQuery等高排列插件怎么使用”的内容了,经过本文的学习后,相信大家对jQuery等高排列插件怎么使用这一问题有了更深刻的体会,具体使用情况还需要大家实践验证。这里是云搜网,小编将为大家推送更多相关知识点的文章,欢迎关注!

赞(0)
【声明】:本博客不参与任何交易,也非中介,仅记录个人感兴趣的主机测评结果和优惠活动,内容均不作直接、间接、法定、约定的保证。访问本博客请务必遵守有关互联网的相关法律、规定与规则。一旦您访问本博客,即表示您已经知晓并接受了此声明通告。