• footer页面布局


    <!DOCTYPE html>
    <html>
        <head>
            <meta charset="utf-8">
            <title></title>
            <style>
                .footer{
                    font-size:15px;
                    text-align:center;
                    width:100%;
                    position:fixed;
                    bottom:0px;
                    margin:7px 0px;
                }
                .footer p{
                    color:#808080;
                    margin:5px 0px;
                }
            </style>
        </head>
        <body>
            <div class="footer">
                <p>##################</p>
                <p>电话:###########</p>
            </div>
        </body>
        <script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.6.0/jquery.js"></script>
        <script type="text/javascript">
            var olbHeight = window.innerHeight || document.documentElement.clientHeight || document.body.clientHeight;
            // navigator.userAgent.indexOf用来判断浏览器类型
            var isAndroid = navigator.userAgent.indexOf('Android') > -1 || navigator.userAgent.indexOf('Adr') > -1;
            if (isAndroid) { // 如果是安卓手机的浏览器
                window.addEventListener("resize", function() {
                    var newHeight = window.innerHeight
                            || document.documentElement.clientHeight
                            || document.body.clientHeight;
                    if (olbHeight > newHeight) {
                        $(".footer").hide();
                    } else {
                        $(".footer").show();
                    }
                });
            }
            //window.onresize = function () {
            //    var h = $(window).height();
            //    //console.log(h+','+window.screen.availHeight)
            //    var u = navigator.userAgent;
            //    if (u.indexOf('Android') > -1 || u.indexOf('Linux') > -1) {
            //        if(h <= window.screen.availHeight/2){
            //            $(".footer").hide();
            //        }else{
            //            $(".footer").show();
            //        }
            //    }
            //}
        </script>
    </html>

  • 相关阅读:
    [UML]类的关系与类图
    libevent学习——例子.md
    有效需求分析培训梳理(一)
    卖出看涨期权和买入看跌期权有什么区别?卖出看跌期权有什么用?
    Hadoop笔记-01概述
    Selenium:上传文件组件处理总结
    华为云云耀云服务器L实例评测|基于L实例安装Prometheus+Grafana插件实现数据可视化监控
    【TcaplusDB知识库】TcaplusDB新增机型介绍
    使用T2-U和Sensor_Hub开发一款智能温湿度计
    JavaScript-箭头函数
  • 原文地址:https://blog.csdn.net/Sple_xiaom/article/details/125487121