网站开发中使用javascript获取浏览器滚动条宽度
在网站开发中,有时候需要获取浏览器滚动条的宽度,在武汉蚂蹄软件服务中心的技术人员指导之下,我实现了该需求。记录如下:
首先说明一下原理:
①生成一个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获取浏览器滚动条宽度的更多相关文章
- 网站开发中很实用的 HTML5 & jQuery 插件
这篇文章挑选了15款在网站开发中很实用的 HTML5 & jQuery 插件,如果你正在寻找能优化网站,使其更具创造力和视觉冲击,那么本文正是你需要的.这些优秀的 jQuery 插件能为你的网 ...
- JavaScript获取浏览器类型与版本
从网上找到一段使用JavaScript判断浏览器以及浏览器版本的比较好的代码,在此记录一下: <script type="text/javascript"> var S ...
- JavaScript获取浏览器版本等信息
** 不同浏览器版本可能存在差异,使用时请测试自己的环境 ** 测试时各个浏览器版本 IE: 11.953.14393.0 Edge: Microsoft Edge 38.14393.0.0;Micr ...
- JavaScript学习总结(十八)——JavaScript获取浏览器类型与版本
从网上找到一段使用JavaScript判断浏览器以及浏览器版本的比较好的代码,在此记录一下: 1 <script type="text/javascript"> 2 v ...
- 整合Spring.net到asp.net网站开发中初探
整合Spring.net到asp.net网站开发中初探 http://www.veryhuo.com 2009-10-21 烈火网 投递稿件 我有话说 Spring提供了一个轻量级的用于构建企业级 ...
- Javascript获取图片原始宽度和高度的方法详解
前言 网上关于利用Javascript获取图片原始宽度和高度的方法有很多,本文将再次给大家谈谈这个问题,或许会对一些人能有所帮助. 方法详解 页面中的img元素,想要获取它的原始尺寸,以宽度为例,可能 ...
- JQuery或JavaScript获取网页的宽度、高等
最近多次使用JQery或JavaScript获取网页的宽度或者高度,在网上搜索N久之后发现很多都是粘贴上去并没有详细的介绍,这里我将会对经常使用的一些获取页面宽高的属性,方法做详细的介绍,以便能够更加 ...
- 网站开发中的相对URL问题--JSP
问题描述: 入门网站开发时,我们会在相对URL问题上有疑惑.例如,在一个jsp页面中引入css外部文件, <link rel="stylesheet" hr ...
- 使用JavaScript获取浏览器Chrome版本信息
Navigator对象包含了有关浏览器的信息 可通过访问其属性appVersion或userAgent来获取浏览器Chrome版本 例如,我所使用的QQ浏览器的appVersion和userAgent ...
随机推荐
- java中log的应用
log的简单应用 备忘 加入jar包commons-logging-1.1.jar log4j.properties 如下(就放在src根目录底下 名字和位置都不要变) #OFF.FATAL.ERRO ...
- JavaScript进阶(五)js中取小数整数部分函数
js中取小数整数部分函数 丢弃小数部分,保留整数部分 js:parseInt(7/2) 向上取整,有小数就整数部分加1 js: Math.ceil(7/2) 四舍五入 js: Math.round(7 ...
- Mplayer 的编译
由于项目要用到mplayer,所以要对mplayer进行编译,首先我的平台如下: 系统:windows xp2 安装好mingw+msys,目录为c:/mingw,其中装的gcc是4.3.2版本的. ...
- 算法精解:最小二乘法C实现
计量经济学研究的直接目的是确定总体回归函数Yi=B1+B2Xi+ui,然而能够得到的只是来自总体的若干样本的观测值,要用样本信息建立的样本回归函数尽可能"接近"地去估计总体回归函数 ...
- iOS中多种方式实现打电话、发短信、写邮件
一.打电话 打电话--方法1 NSURL *URL = [NSURL URLWithString:@"tel://10010"]; [[UIApplication sharedAp ...
- 如何在Eclipse CDT中编译含有多个main函数的项目
最近在杭电ACM上做题,使用的C++工具是Eclipse,但是Eclipse CDT不能同时存在多个main函数的文件,上网也搜了很多资料,但是按他们的步骤来,还是不能实现自己想要的效果.经过一下午的 ...
- CoolBlog开发笔记第5课:请求与响应
教程目录 1.1 CoolBlog开发笔记第1课:项目分析 1.2 CoolBlog开发笔记第2课:搭建开发环境 1.3 CoolBlog开发笔记第3课:创建Django应用 1.4 CoolBlog ...
- 深入了解Map
联系 Java中的Map类似于OC的Dictionary,都是一个个键值对组成,一键对应一值.我在之前的文章中讲解过Set,其实在JAVA底层Set依赖的也是Map,那我们都知道,Set是单列的(只有 ...
- miniUI中弹出框问题
---恢复内容开始--- 设置页面弹出框并提交弹出框内容 弹出按钮 <a class="btn_color_1" onclick="onEdit(0)"& ...
- 学好js的步骤
第一步:打基础,建议看<JavaScript权威指南>,并作为参考书,供以后学习用. 第二步:进阶学习:建议看<JavaScript高级程序设计>,<精通JavaScri ...