zoukankan      html  css  js  c++  java
  • 元旦活动页面总结

    1一个日历插件

    代码格式:

    <!DOCTYPE html>
    <html>
        <head>
            <meta charset="UTF-8">
            <title></title>
            <style>
            .box{margin: 200px auto; 500px;}
            </style>
            <link rel="stylesheet" href="css/mobiscroll.2.13.2.css" />
            <script src="js/jquery-3.0.0.js"></script>
            <script type="text/javascript" src="js/mobiscroll.2.13.2.js" ></script>
        </head>
        <body>
            <div class="box">
                <input type="text" name="one" id="one" value="2016-01-02" />
                <input type="text" name="one" id="two" value="2016-01-02" />
            </div>
        </body>
    </html>
    <script>
         $(function () {  
            $("#one").mobiscroll().date({  
                theme: "android-ics light",  
                lang: "zh",
                startYear:2015,
                cancelText: null,  
                dateFormat: 'yy-mm-dd', //返回结果格式化为年月格式  
                // wheels:[], 设置此属性可以只显示年月,此处演示,就用下面的onBeforeShow方法,另外也可以用treelist去实现  
                //onBeforeShow: function (inst) { inst.settings.wheels[0].length>2?inst.settings.wheels[0].pop():null; }, //弹掉“日”滚轮  
                headerText: function (valueText) { //自定义弹出框头部格式  
                    array = valueText.split('-');  
                    return array[0] + "年" + array[1] + "月" +array[2] + "日";  
                }
            });
            
            $("#two").mobiscroll().date({  
                theme: "android-ics light",  
                lang: "zh",
                startYear:2015,
                cancelText: null,  
                dateFormat: 'yy-mm-dd', //返回结果格式化为年月格式  
                // wheels:[], 设置此属性可以只显示年月,此处演示,就用下面的onBeforeShow方法,另外也可以用treelist去实现  
                //onBeforeShow: function (inst) { inst.settings.wheels[0].length>2?inst.settings.wheels[0].pop():null; }, //弹掉“日”滚轮  
                headerText: function (valueText) { //自定义弹出框头部格式  
                    array = valueText.split('-');  
                    return array[0] + "年" + array[1] + "月" +array[2] + "日";  
                }
            });  
            });  
    </script>

    2、获取一个元素的高度:height();innerHeight();outerHeight();

    3、获取一个元素定位后 距离顶部的距离:$('.ele').positiong().top;

    4、背景渐变

    #box{
                     600px;
                    height: 300px;
                    background: linear-gradient(125deg ,rgb(35, 207, 252) 20%,rgb(135, 107, 152) 40%, rgb(195, 105, 199) 60%,rgb(15, 205, 99) 80%, rgb(225, 175, 19) 100%);
                }

  • 相关阅读:
    asp.net GDI+绘制矩形渐变
    asp.net GDI+把图片绘制成自定义的椭圆形状
    asp.net TreeView控件绑定数据库显示信息
    asp.net GridView控件中诗选全选和全不选功能
    PHP 笔记——会话控制
    PHP 笔记——String 字符串
    PHP 笔记——Web页面交互
    PHP 笔记——PDO操作数据库
    PHP 笔记——操作MySQL数据库
    PHP 笔记——Array 数组
  • 原文地址:https://www.cnblogs.com/gaidalou/p/6214733.html
Copyright © 2011-2022 走看看