如何动态获取浏览器的高度和宽度?

2024-07-01

我想做的是创建一个不依赖媒体查询的聊天框。这从数学上设置了聊天框内容的大小。

我正在尝试$(window).height()/$(window).width()但这并没有覆盖整个浏览器窗口。我想在 javascript/jquery 中完成这一切,而不需要 css/media 查询


试试这个代码片段

(function() {
  window.onresize = displayWindowSize;
  window.onload = displayWindowSize;

  function displayWindowSize() {
    let myWidth = window.innerWidth;
    let myHeight = window.innerHeight;
    // your size calculation code here
    document.getElementById("screen").innerHTML = myWidth + "x" + myHeight;
  };


})();
<div id="screen"></div>
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

如何动态获取浏览器的高度和宽度? 的相关文章

  • 禁用 WebSocket 证书验证

    我需要禁用 WebSocket 的证书验证 因为我使用的是自签名证书 我在这个问题中发现Websocket SSL 连接 https stackoverflow com questions 30902547 websocket ssl co
  • 用javascript去掉未使用的小数

    我有一个货币输入 只需要返回有效数字 输入始终有两位小数 因此 4 00 gt 4 4 10 gt 4 1 4 01 gt 4 01 这是我目前正在做的事情 chop off unnecessary decimals if val char
  • 媒体查询和 Bootstrap 有什么区别? [关闭]

    Closed 这个问题需要多问focused help closed questions 目前不接受答案 奇怪的是 CSS3 媒体查询和 Bootstrap 之间的区别是什么 我访问过很多网站 但每个人都说 两者都是为了网站的响应能力 如果
  • 显示为问号的度unicode

    以下代码显示为问号而不是度数符号 var airF Math round Number MDTMOBILE RWISWeather i AirTemp u00B0 F tempTable find td eq 4 text airF var
  • Javascript 日期时间字符串转 UTC 日期时间和 UTC 转本地日期时间

    我需要将字符串转换为 UTC 日期 然后将 UTC 日期转换为本地日期 这是我的代码 var dateStr 9 8 2015 12 44 00 PM console log strtoUTCtoLocal dateStr function
  • 在 Javascript 中解析 xml 并遍历子节点

    我需要用 javascript 解析下面的 xml
  • 当没有电子邮件客户端时,“mailto:”会做什么?

    我正在开发一个网站 什么是mailto 如果没有电子邮件客户端 如 Outlook Thunderbird 等 如何打开 它可以在我的电脑上运行 该电脑装有 Outlook 但如果有人想要怎么办 mailto 例如 在 gmail com
  • d3.js 雷达图 - 填充线条之间

    我正在尝试在其中两个三角形之间创建填充 例如在红色和绿色三角形之间创建红色填充 有人知道如何做到这一点吗 我见过另一个雷达图的例子 我相信它做了类似的事情 尽管我认为他们使用CSS而不是d3创建填充 使用径向图用 mbostock 的答案解
  • 反序列化 jQuery 序列化表单

    我正在尝试将表单输入传递到 WebMethod 中并执行某些操作 我用了jQuery 序列化 http api jquery com serialize
  • 在 emberjs 中绑定子视图和集合

    我正在尝试渲染视图Team里面一个 outlet This Team视图由一个简单的Person视图 团队领导者 以及集合Person意见 团队成员 插座是通过调用设置的connectOutlet 在应用程序控制器上 虽然Person子视图
  • 如何在单击时和用户单击离开时关闭菜单?

    我有以下代码 function document ready function clicker class click function show menu users show jQuery clicker class click fun
  • 从 Verdaccio 软件包版本历史记录中删除版本

    我使用取消发布版本npm unpublish
  • HTML / Javascript - 通过单击父行来展开和折叠表行(子行)

    我几天来一直在尝试解决一个问题 终于明白 如 果没有帮助 我将不会成功 我想做一件我们每天在互联网上看到的常见事情 能够单击表格行以显示更多详细信息 但这里的更多细节并不意味着文本块 而是指与父行具有相同形状的子行 以下是 HTML 表格的
  • 'data' 为 null 或不是对象 IE8

    我正在使用 iframe 将消息传输到其父页面postMessage 这是我的代码 在 iframe 中 history date click function event window top postMessage this text
  • 确定方法是同步还是异步

    在node js中 是否可以 使用函数 确定方法是同步还是异步 我想编写一个执行以下操作的函数 function isSynchonous methodName if the method is synchronous return tru
  • HTML5离线缓存谷歌字体API

    我正在尝试创建一个离线 HTML5 测试应用程序 并同时使用新的 google fonts api 有谁知道如何缓存远程字体 简单地将 api 调用放入缓存清单中是行不通的 我认为这是因为 api 实际上加载了其他文件 ttf eot 等
  • 为 div 标签设置属性

    我有一个简单的代码 div class content div 我想使用 javascript 回显 div 标签内的某些内容以显示这种方式 div class content div 我需要使用 javascript 因为如果屏幕宽于 9
  • VueJs 操作内联模板并重新初始化它

    这个问题类似于VueJS 在内联模板组件中重新编译 HTML https stackoverflow com questions 34087195 vuejs re compile html in an inline template co
  • 克隆元件查找器

    在研究可用的同时ElementFinder and ElementArrayFinder方法 我注意到有一个clone method http angular github io protractor api view ElementFin
  • 通过 javascript 选择/取消选择所有复选框单击单个复选框

    I have a form in which I have two table with some rows 我希望当我点击时选择 取消选择全部复选框 而不是针对该特定表应选中该复选框下方的复选框 我有一个可以工作的 JavaScript

随机推荐