zoukankan      html  css  js  c++  java
  • jQuery自定义漂亮的下拉框插件8种效果

    jquery美化选择器实例有:边框、下划线、 伸缩 、滑动、 覆盖、 旋转、 弹出层选择 、环形效果。



     

    在线预览

    实例代码

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    29
    30
    31
    32
    33
    34
    35
    <body class="demo-1">
            <div class="container">
                <header class="codrops-header">
                    <h1> 自定义选择元素</h1>
                    <nav class="codrops-demos">
                        <a class="current-demo" href="index.html">边框</a>
                        <a href="index2.html">下划线</a>
                        <a href="index3.html">伸缩</a>
                        <a href="index4.html">滑动</a>
                        <a href="index5.html">覆盖</a>
                        <a href="index6.html">旋转</a>
                        <a href="index7.html">弹出层选择</a>
                        <a href="index8.html">环形效果</a>
                    </nav>
                </header>
                <section>
                    <select class="cs-select cs-skin-border">
                        <option value="" disabled selected> 联系人方式</option>
                        <option value="email">E-Mail</option>
                        <option value="twitter">Twitter</option>
                        <option value="linkedin">LinkedIn</option>
                    </select>
                </section>
     
            </div><!-- /container -->
            <script src="js/classie.js"></script>
            <script src="js/selectFx.js"></script>
            <script>
                (function() {
                    [].slice.call(document.querySelectorAll('select.cs-select')).forEach(function(el) {
                        new SelectFx(el);
                    });
                })();
            </script>
        </body>
  • 相关阅读:
    JS收集<3>:限制URL
    TSQL小收集<1>:为已经存在的表添加唯一约束
    第一个NHibernate实例 yangan
    用Javascript获取select的值 yangan
    获取页面名称语句 yangan
    asp.net中当服务器出错时显示指定的错误页面,同时把错误信息写入系统日志文件 yangan
    Log4Net使用指南 yangan
    明确自己的首要责任
    《大数据时代》摘录
    2013年3月阅读链接
  • 原文地址:https://www.cnblogs.com/libin-1/p/6065262.html
Copyright © 2011-2022 走看看