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>
  • 相关阅读:
    泛型通配符 ?
    算法:确定一个字符串的所有字符是否全都不同。假使不允许使用额外的数据结构
    Math类中常用方法
    很认真的聊一聊程序员的自我修养
    高性能最终一致性框架Ray之基本概念原理
    asp.net core VS goang web[修正篇]
    Asp.net core与golang web简单对比测试
    高性能Socket组件和RPC,让你像写本地代码一样开发网络应用和分布式程序
    .NET MVC 插件化框架支持原生MVC的Area和路由特性
    .NET MVC插件化开发框架源码(插件功能完善版)
  • 原文地址:https://www.cnblogs.com/fger/p/12611008.html
Copyright © 2011-2022 走看看