• linkedu视频
  • 平面设计
  • 电脑入门
  • 操作系统
  • 办公应用
  • 电脑硬件
  • 动画设计
  • 3D设计
  • 网页设计
  • CAD设计
  • 影音处理
  • 数据库
  • 程序设计
  • 认证考试
  • 信息管理
  • 信息安全
菜单
linkedu.com
  • 网页制作
  • 数据库
  • 程序设计
  • 操作系统
  • CMS教程
  • 游戏攻略
  • 脚本语言
  • 平面设计
  • 软件教程
  • 网络安全
  • 电脑知识
  • 服务器
  • 视频教程
  • dedecms
  • ecshop
  • z-blog
  • UcHome
  • UCenter
  • drupal
  • WordPress
  • 帝国cms
  • phpcms
  • 动易cms
  • phpwind
  • discuz
  • 科汛cms
  • 风讯cms
  • 建站教程
  • 运营技巧
您的位置:首页 > CMS教程 >建站教程 > 详解JS,Jquery获取屏幕的宽度和高度代码

详解JS,Jquery获取屏幕的宽度和高度代码

作者:站长图库 字体:[增加 减小] 来源:互联网 时间:2022-04-29

站长图库向大家介绍了详解JS,Jquery获取屏幕的宽度和高度代码等相关知识,希望对您有所帮助

JS,Jquery获取屏幕的宽度和高度代码,获取的方法有很多种,但不管多少总,大致的内置函数还是那几个,现在就简单罗列出来。

javascript获取屏幕的宽度和高度代码

网页可见区域宽: document.body.clientWidth

网页可见区域高: document.body.clientHeight

网页可见区域宽: document.body.offsetWidth (包括边线的宽)

网页可见区域高: document.body.offsetHeight (包括边线的高)

网页正文全文宽: document.body.scrollWidth

网页正文全文高: document.body.scrollHeight

网页被卷去的高: document.body.scrollTop

网页被卷去的左: document.body.scrollLeft

网页正文部分上: window.screenTop

网页正文部分左: window.screenLeft

屏幕分辨率的高: window.screen.height

屏幕分辨率的宽: window.screen.width

屏幕可用工作区高度: window.screen.availHeight

屏幕可用工作区宽度: window.screen.availWidth

Jquery获取屏幕的宽度和高度代码

$(document).ready(function(){    alert($(window).height()); //浏览器当前窗口可视区域高度    alert($(document).height()); //浏览器当前窗口文档的高度    alert($(document.body).height());//浏览器当前窗口文档body的高度    alert($(document.body).outerHeight(true));//浏览器当前窗口文档body的总高度 包括border padding margin    alert($(window).width()); //浏览器当前窗口可视区域宽度    alert($(document).width());//浏览器当前窗口文档对象宽度    alert($(document.body).width());//浏览器当前窗口文档body的宽度    alert($(document.body).outerWidth(true));//浏览器当前窗口文档body的总宽度 包括border padding margin})



分享到:QQ空间新浪微博腾讯微博微信百度贴吧QQ好友复制网址打印

您可能想查找下面的文章:

  • 详解JS,Jquery获取屏幕的宽度和高度代码

相关文章

  • 2022-04-29聊聊Bootstrap5中的断点与容器
  • 2022-04-29Photoshop制作超酷的木纹立体字教程
  • 2022-04-29ThinkPHP6对接微信扫码登录
  • 2022-04-29Illustrator绘制心形效果的粉色海报
  • 2022-04-29Dedecms5.7如何将系统的data目录迁移到web以外目录
  • 2022-04-29手把手教你基于uniapp框架实现动态路由、动态tabbar
  • 2022-04-29网站推广最全的解释
  • 2022-04-29解析TP框架下mongo的基础操作及其注意点
  • 2022-04-29uniapp实现微信小程序全局分享的示例代码
  • 2022-04-29说说在Laravel中怎么执行Shell命令 ?

文章分类

  • dedecms
  • ecshop
  • z-blog
  • UcHome
  • UCenter
  • drupal
  • WordPress
  • 帝国cms
  • phpcms
  • 动易cms
  • phpwind
  • discuz
  • 科汛cms
  • 风讯cms
  • 建站教程
  • 运营技巧

最近更新的内容

    • Illustrator CS5绘制逼真的红辣椒教程
    • Thinkphp volist多重循环原样输出数组key值
    • 如何辨别网站是合法的链接来源还是链接工厂
    • dedecms页面获取会员状态的代码
    • Photoshop使用素材制作唯美的花体字
    • 利用画笔及描边路径制作漂亮的金色树叶字
    • 浅谈angular中控制器、服务和指令的关系
    • Node.js设置NODE_ENV时发生错误怎么解决?
    • 突破dedecms软件下载地址数30个的限制
    • Photoshop制作甜美质感的宝石艺术字教程

关于我们 - 联系我们 - 免责声明 - 网站地图

©2020-2025 All Rights Reserved. linkedu.com 版权所有