zoukankan      html  css  js  c++  java
  • 【前端】css js 全屏 esc退出全屏 滚动条隐藏 兼容火狐,文字超出容器长度省略号显示

    全屏

      if (docElm.requestFullscreen) {
                    docElm.requestFullscreen();
                }
                else if (docElm.msRequestFullscreen) {
                    docElm = document.body;
                    docElm.msRequestFullscreen();
                }
                else if (docElm.mozRequestFullScreen) {
                    docElm.mozRequestFullScreen();
                }
                else if (docElm.webkitRequestFullScreen) {
                    docElm.webkitRequestFullScreen();
                }
    

     监听esc退出全屏

    window.onresize = function () {
            if (!checkFull()) {
                //要执行的动作
                。。。。
            }
        }
        function checkFull() {
            //全屏和退出全屏时 给元素写入状态属性来判断
            var status = 1;
            var docElm = $(fullScreenObj).get(0); status = $(fullScreenObj).attr("data-status");
            if (status != 1 && status != 2) {
                status = 1;
            }
    
            console.log(status); if (status == 2) {
                $(fullScreenObj).attr("data-status", 1);
                return false;
    
            } else {
                $(fullScreenObj).attr("data-status", 2);
                return true;
            }
    
        }        
    

     滚动条隐藏:

    火狐:

     overflow-y:scroll;
                scrollbar-color: transparent transparent;
                  scrollbar-track-color: transparent;
      -ms-scrollbar-track-color: transparent;
    

     其他:

     ul.ul-link::-webkit-scrollbar{
      display: none;
    }
    

     文字超出容器长度省略号显示

    text-overflow: ellipsis;
                overflow: hidden;
                white-space: nowrap;
    

     背景色:

    #E3EDCD
    文字:green
  • 相关阅读:
    在C#中如何使用资源的方法
    C#调用windows API的一些方法
    Uml学习-类图简介
    Uml学习-用例建模简介
    sqlserver中DATE类型的数据转化 CONVERT
    mysql database和schema区别
    nginx buffer
    django pk 和id用法
    sed正则
    kong 插件开发分析
  • 原文地址:https://www.cnblogs.com/HelloQLQ/p/15058321.html
Copyright © 2011-2022 走看看