jquery实现分组过滤筛选数据列表效果代码-html代码-BFW代码库

jquery实现分组过滤筛选数据列表效果代码

代码语言：html

所属分类：其他

代码描述：jquery实现分组过滤筛选数据列表效果代码

下面为部分代码预览，完整代码请点击下载或在bfwstudio webide中打开

<!DOCTYPE html>
<html>

<head>
    <meta charset="UTF-8">
    <style>
        body {
                margin:0;
        }
        .wrapper {
                display:flex;
                background:#57068c;
                width:100%;
                height:100vh;
                overflow:hidden;
                font-family:Helvetica,sans serif;
                color:#ffffff99;
        }
        .wrapper .title {
                position:absolute;
                top:10px;
                left:20px;
                font-size:16px;
                font-weight:600;
                line-height:20px;
                text-transform:uppercase;
                letter-spacing:2px;
        }
        .wrapper .title div {
                background:#ffffff99;
                width:20px;
                height:2px;
                margin:10px 0;
        }
        .wrapper .credit {
                position:absolute;
                bottom:10px;
                right:20px;
                font-family:'Sacramento',cursive;
        }
        .wrapper .credit a {
                color:#fff;
                text-decoration:none;
                opacity:.6;
        }
        .wrapper .credit a:hover {
                opacity:1;
                text-decoration:underline;
        }
        .artboard {
                position:relative;
                margin:auto;
                width:44vw;
                height:50vh;
        }
        .filterDivs {
                padding-top:20px;
        }
        .filterDivs .filterDiv {
                width:5vw;
                height:10vmin;
                display:inline-block;
                margin:1vw;
                transition:.5s ease-in-out 0s;
        }
        .filterDivs .yellow {
                background:#FFD568;
                opacity:1;
        }
        .filterDivs .blue {
 .........完整代码请登录后点击上方下载按钮下载查看