zoukankan      html  css  js  c++  java
  • 一、移动端弹框滚动条出现两条

    一、移动端弹框滚动条问题  html格式化

    移动端

    代码如下:

    <!DOCTYPE html>
    <html>
    
    <head>
        <title></title>
        <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, viewport-fit=cover">
        <style type="text/css">
    
        </style>
    </head>
    
    <body>
        <button class="click" style=" 200px;height: 200px;background-color: red;"></button>
        <section>
            <p>111111111111</p>
            <p>111111111111</p>
            <p>111111111111</p>
            <p>111111111111</p>
            <p>111111111111</p>
            <p>111111111111</p>
            <p>111111111111</p>
            <p>111111111111</p>
            <p>111111111111</p>
            <p>111111111111</p>
            <p>111111111111</p>
            <p>111111111111</p>
            <p>111111111111</p>
            <p>111111111111</p>
            <p>111111111111</p>
            <p>111111111111</p>
            <p>111111111111</p>
            <p>111111111111</p>
            <p>111111111111</p>
            <p>111111111111</p>
            <p>111111111111</p>
            <p>111111111111</p>
            <p>111111111111</p>
            <p>111111111111</p>
            <p>111111111111</p>
            <p>111111111111</p>
            <p>111111111111</p>
            <p>111111111111</p>
            <p>111111111111</p>
            <p>111111111111</p>
            <p>111111111111</p>
            <p>111111111111</p>
            <p>111111111111</p>
            <p>111111111111</p>
            <p>111111111111</p>
            <p>111111111111</p>
            <p>111111111111</p>
        </section>
        <section class="layer_notice" style="display: none;">
            <p>222222222222</p>
            <p>222222222222</p>
            <p>222222222222</p>
            <p>222222222222</p>
            <p>222222222222</p>
            <p>222222222222</p>
            <p>222222222222</p>
            <p>222222222222</p>
            <p>222222222222</p>
            <p>222222222222</p>
            <p>222222222222</p>
            <p>222222222222</p>
            <p>222222222222</p>
            <p>222222222222</p>
            <p>222222222222</p>
            <p>222222222222</p>
            <p>222222222222</p>
            <p>222222222222</p>
            <p>222222222222</p>
            <p>222222222222</p>
            <p>222222222222</p>
            <p>222222222222</p>
            <p>222222222222</p>
            <p>222222222222</p>
            <p>222222222222</p>
            <p>222222222222</p>
            <p>222222222222</p>
            <p>222222222222</p>
            <p>222222222222</p>
            <p>222222222222</p>
            <p>222222222222</p>
            <p>222222222222</p>
            <p>222222222222</p>
            <p>222222222222</p>
            <p>222222222222</p>
            <p>222222222222</p>
            <p>222222222222</p>
            <p>222222222222</p>
            <p>222222222222</p>
            <p>222222222222</p>
            <p>222222222222</p>
            <p>222222222222</p>
            <p>222222222222</p>
            <p>222222222222</p>
            <p>222222222222</p>
            <p>222222222222</p>
            <p>222222222222</p>
        </section>
        <script src="https://cdn.bootcss.com/jquery/2.2.1/jquery.min.js"></script>
        <script src="https://www.layuicdn.com/layui/layui.js"></script>
        <script type="text/javascript">
        $(document).ready(function() {
            layui.use(['layer'], function() {
                var layer = layui.layer //日期
                $(".click").click(function() {
                    //捕获页
                    layer.open({
                        type: 1,
                        shade: false,
                        fixed: true,
                        scrollbar: false, //屏蔽浏览器滚动条
                        area: ['100%', '100%'],
                        title: "测试", //不显示标题
                        content: $('.layer_notice'), //捕获的元素,注意:最好该指定的元素要存放在body最外层,否则可能被其它的相对元素所影响
                        cancel: function() {
                            //layer.msg('捕获就是从页面已经存在的元素上,包裹layer的结构', {time: 5000, icon:6});
                        },
                        success: function() {}
                    });
                });
            });
        });
        </script>
    </body>
    
    </html>
  • 相关阅读:
    ul做导航栏
    论布局,bfc,margin塌陷和合并,经典bug
    mon-hom
    新浪下拉菜单模仿
    JQ筛选方法,筛选父子元素
    JQuery筛选选择器
    JQuery隐式迭代
    python 和 C# DES加密
    交互设计[1]--设计心理学
    javascript学习(9)——[设计模式]单例
  • 原文地址:https://www.cnblogs.com/fger/p/12611008.html
Copyright © 2011-2022 走看看