电视网页适配大屏显示

huaiyanchen

已于 2024-01-16 08:38:31 修改

阅读量816

点赞数 13

文章标签：前端

于 2024-01-11 13:25:26 首次发布

本文链接：https://blog.csdn.net/qq_38552198/article/details/135523094

版权

用rem单位可参考如下方法

总结

调整已安装浏览器字体大小，火狐浏览器设置-无障碍环境

关闭自动调整字号，设置合适字号

以下为试验历程，可忽略

电视下载浏览器

我们使用的是小米电视，盒子也可参考以下方式

1.查找自身应用商店，搜索llQ

2.安装电视助手，手机下载安装包，安装到电视，手机安装包需要移动安装包位置在文件顶级可以检测

3.U盘安装

在安装版本上由于电视本身安卓版本不高，建议需要安卓低版本安装，文章顶部有火狐浏览器.apk

设置浏览器显示分辨率

由于viewport适用于移动端，其他网页不受影响。全屏模式下改代码会失效，

viewport设置想要显示的分辨率宽度

<meta name="viewport" content="width=1920">

或可利用viewport整体设置缩放

 <meta
      name="viewport"
      content="width=device-width, initial-scale=0.5, maximum-scale=5.0, minimum-scale=0.5, user-scalable=no, target-densitydpi=device-dpi"
    />

window.screen.width // 获取屏幕宽度，.apk为960

// 设置主题颜色
<meta name="theme-color" content="#0a1992">

// 设置全屏 及浏览器导航栏
    <meta name="apple-mobile-web-app-capable" content="yes" />
    <meta name="apple-mobile-web-app-status-bar-style" content="black-translucent" />
    <meta name="browsermode" content="application" />
    <meta name="full-screen" content="true" />
    <meta name="full-screen" content="yes" />
    <meta name="x5-fullscreen" content="true" />
    <meta name="x5-page-mode" content="app" />
    <meta name="360-fullscreen" content="true" />

// 设置滚动隐藏导航栏，未生效
  <body  οnlοad="setTimeout(function(){window.scrollTo(0,1)},100);">

火狐设置-定制主题颜色可修改导航栏位置可修改为顶部或底部

安装火狐 Nightly 安卓版本可以访问 about:config 修改设置参数，重启浏览器生效，

http://kb.mozillazine.org/About:config_entrieshttp://xn--8nr392h2ma548c

未找到可用隐藏导航栏，其他参数或功能可能有用

window打开新窗口
location=no 隐藏地址栏不生效，toolbar=no生效，可设置为只读窗口，无法修改访问地址

// 打开新窗口全屏
        window.open('http://www.muguilin.com', '_blank', 'width=' + screen.width + ', height=' + screen.height + ', top=0, left=0, toolbar=no, menubar=no, location=no, status=no, help=no, center=yes, scrollbars=yes, resizable=yes, minmizebutton=yes, maxmizebutton=yes');