在网站开发中,有时候需要获取浏览器滚动条的宽度,在武汉蚂蹄软件服务中心的技术人员指导之下,我实现了该需求。记录如下:

  首先说明一下原理:

  ①生成一个div,设置滚动条不可见,记录其宽度;

  ②将上面的div设置滚动条可见,在记录div宽度;

  ③取两次宽度的差值,即为滚动条的宽度。

  使用jQuery简单实现如下:

function getScrollWidth() {
var $div = $("<div style='position:absolute; top:-1000px; width:100px; height:100px; overflow:hidden;'></div>");
$("body").append($div);
var noScroll = $div[0].clientWidth;
$div.css("overflow-y", "scroll");
var scroll = $div[0].clientWidth;
$div.remove();
return noScroll - scroll;
}

网站开发中使用javascript获取浏览器滚动条宽度的更多相关文章

  1. 网站开发中很实用的 HTML5 & jQuery 插件

    这篇文章挑选了15款在网站开发中很实用的 HTML5 & jQuery 插件,如果你正在寻找能优化网站,使其更具创造力和视觉冲击,那么本文正是你需要的.这些优秀的 jQuery 插件能为你的网 ...

  2. JavaScript获取浏览器类型与版本

    从网上找到一段使用JavaScript判断浏览器以及浏览器版本的比较好的代码,在此记录一下: <script type="text/javascript"> var S ...

  3. JavaScript获取浏览器版本等信息

    ** 不同浏览器版本可能存在差异,使用时请测试自己的环境 ** 测试时各个浏览器版本 IE: 11.953.14393.0 Edge: Microsoft Edge 38.14393.0.0;Micr ...

  4. JavaScript学习总结(十八)——JavaScript获取浏览器类型与版本

    从网上找到一段使用JavaScript判断浏览器以及浏览器版本的比较好的代码,在此记录一下: 1 <script type="text/javascript"> 2 v ...

  5. 整合Spring.net到asp.net网站开发中初探

    整合Spring.net到asp.net网站开发中初探 http://www.veryhuo.com 2009-10-21 烈火网 投递稿件 我有话说   Spring提供了一个轻量级的用于构建企业级 ...

  6. Javascript获取图片原始宽度和高度的方法详解

    前言 网上关于利用Javascript获取图片原始宽度和高度的方法有很多,本文将再次给大家谈谈这个问题,或许会对一些人能有所帮助. 方法详解 页面中的img元素,想要获取它的原始尺寸,以宽度为例,可能 ...

  7. JQuery或JavaScript获取网页的宽度、高等

    最近多次使用JQery或JavaScript获取网页的宽度或者高度,在网上搜索N久之后发现很多都是粘贴上去并没有详细的介绍,这里我将会对经常使用的一些获取页面宽高的属性,方法做详细的介绍,以便能够更加 ...

  8. 网站开发中的相对URL问题--JSP

    问题描述: 入门网站开发时,我们会在相对URL问题上有疑惑.例如,在一个jsp页面中引入css外部文件, <link rel="stylesheet"          hr ...

  9. 使用JavaScript获取浏览器Chrome版本信息

    Navigator对象包含了有关浏览器的信息 可通过访问其属性appVersion或userAgent来获取浏览器Chrome版本 例如,我所使用的QQ浏览器的appVersion和userAgent ...

随机推荐

  1. Java 类加载机制 ClassLoder

    纸上得来终觉浅,绝知此事要躬行  --陆游       问渠那得清如许,为有源头活水来  --朱熹 一个类从被加载到内存中开始到卸载出内存为止,它的整个生命周期包括了:加载(loading).验证(V ...

  2. Unity热更新之C#反射动态获取类属性及方法

    如果我们要为发布出去的游戏更新一些功能,但又不想让用户重新下载整个游戏包,只让他下载我们更新的资源包,用assetBundle打包资源的方式是可以的,但其中有个最大的例外,那就是脚本. 虽然asset ...

  3. VS2010中NET4项目中使用LOG4NET办法

    两年以前项目中是用的log4net.dll是net2.0环境下面的,最近在官网http://logging.apache.org/log4net/download_log4net.cgi找到了net4 ...

  4. Java 反射之JDK动态代理

    Proxy提供用于创建动态代理类和代理对象的静态方法,它也是所有动态代理类的父类.如果我们在程序中为一个或多个接口动态地生成实现类,就可以使用Proxy来创建动态代理类:如果需要为一个或多个接口动态的 ...

  5. 使用GDAL将下载的Google卫星图像转为带坐标的tif

    网上有很多下载Google地图的卫片的软件,一般下载下来的图像都是jpg格式的,另外附带一个坐标信息的描述文件.这样的数据不能直接拿来在遥感或者GIS软件中使用,因为图像里面没有投影和坐标信息,所以就 ...

  6. Android平台根目录文件

    > 系统分区 # adb shell # mount rootfs / rootfs ro 0 0 tmpfs /dev tmpfs rw,mode=755 0 0 devpts /dev/pt ...

  7. 图像检索:FCTH(Fuzzy Color and Texture Histogram)算法

    模糊颜色和纹理直方图(Fuzzy Color and Texture Histogram,FCTH) 本文节选自论文<基于半监督和主动学习相结合的图像的检索研究> FCTH 特征可从 3 ...

  8. 【66】Scanner类用法详解

    Scanner是新增的一个简易文本扫描器,在 JDK 5.0之前,是没有的. public final class Scanner extends Object implements Iterator ...

  9. Gradle 1.12用户指南翻译——第二十六章. War 插件

    其他章节的翻译请参见: http://blog.csdn.net/column/details/gradle-translation.html 翻译项目请关注Github上的地址: https://g ...

  10. VC工程的.gitignore模板

    VC工程的.gitignore模板 文件内容如下: #====================================== # .gitignore # # 2015-01-09 create ...