对scrollTop的研究

本文主要从原生 JS以及jquery来说明scrollTop是如何实现的,以及一些技巧,以及在PC端和移动端使用的差异. 首先用代码表示下如何回到顶部的简单原理 <!doctype html> <html lang="zh_EN"> <head> <meta charset="UTF-8"> <title>滚动条距离</title> <script> window.onload=fu…

关于offsetTop offsetHeight clientHeight scrollHeight scrollTop的区别研究

我是以chrome浏览器做的研究. 先看一段代码: <script> window.addEventListener('DOMContentLoaded',function(){ var node1 = document.querySelector('#father'); var node2 = document.querySelector('#child'); console.log('offsetTop==offsetHeight==scrollTop==scrollHeight==cli…

搞懂offsetY、offsetTop、scrollTop、offsetHeight、scrollHeight

先搞offsetTop,最难懂的就是它了官方解释:返回当前元素的上边界到它的包含元素的上边界的偏移量,以像素为单位.这真TM坑爹啊!有木有!经过仔细研究查找得出结论:offsetTop是相对于离它最近的具有绝对或相对定位的父级元素的距离,有点绕口是不是?别急,咱慢慢剥开它...首先一定要明白offsetTop是一个相对值,那它到底是相对于谁的值呢,现在的女明星不都流行找干爹嘛,offsetTop也给自己找了一个,别人的要求是要有钱有权,而它的要求是要有position(只能是relative和…

Javascript scrollTop 20大洋

花了20大洋,买了一个视频,这是读书笔记 <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title></title> <style> b…

js获取浏览器基本信息：document.body.clientWidth/clientHeight/scrollWidth/scrollTop。（转）

js获取浏览器基本信息:document.body.clientWidth/clientHeight/scrollWidth/scrollTop. 分类: js.jquery.ext.js技术2011-07-28 17:20 6532人阅读评论(1) 收藏举报浏览器firefoxopera文档htmlie 网页可见区域宽:document.body.clientWidth网页可见区域高:document.body.clientHeight网页可见区域宽:document.body.offs…

像VUE一样写微信小程序-深入研究wepy框架

像VUE一样写微信小程序-深入研究wepy框架微信小程序自发布到如今已经有半年多的时间了,凭借微信平台的强大影响力,越来越多企业加入小程序开发. 小程序于M页比相比,有以下优势: 1.小程序拥有更多的能力,包括定位.录音.文件.媒体.各种硬件能力等,想象空间更大 2.运行在微信内部,体验更接近APP 3.在过度竞争的互联网行业中,获取一个有效APP用户的成本已经非常高了,小程序相比APP更加轻量.即用即走, 更容易获取用户开发对比从开发角度来讲,小程序官方封装了很多常用组件给开发带来很多便…

深入研究-webkit-overflow-scrolling:touch及ios滚动

1. -webkit-overflow-scrolling:touch是什么? MDN上是这样定义的: -webkit-overflow-scrolling 属性控制元素在移动设备上是否使用滚动回弹效果. auto: 使用普通滚动, 当手指从触摸屏上移开,滚动会立即停止. touch: 使用具有回弹效果的滚动, 当手指从触摸屏上移开,内容会继续保持一段时间的滚动效果.继续滚动的速度和持续的时间和滚动手势的强烈程度成正比.同时也会创建一个新的堆栈上下文. 在移动端上,在你用overflow-y:s…

关于document.body.scrollTop与documentElement.scrollTop

遇到document.body.scrollTop值为0的问题今天在写一个小demo的时候,使用滚动条,我用document.body.scrollTop获取滚动条的位置,但是很奇怪的发现在谷歌上获取到的是0,经过搜索后发现可以使用documentElement.scrollTop可以获取到,于是就去研究了一下可以使用window.pageYoffset 所有主流浏览器都支持 pageXOffset 和 pageYOffset 属性. 注意: IE 8 及更早 IE 版本不支持该属性但可…

图片滚动（UP）的JS代码详解（offsetTop、scrollTop、offsetHeigh）【转】

源地址信息技术教材配套的光盘里有一段设置图片滚动的JS代码,与网络上差不多,实现思路:一个设定高度并且隐藏超出它高度的内容的容器demo,里面放demo1和 demo2,demo1是滚动内容,demo2为demo1的直接克隆,通过不断改变demo的scrollTop或者scrollLeft达到滚动的目的,当demo1与demo2的交界处滚动至demo顶端时直接跳回初始位置,因为demo1与demo2一样,所以分不出跳动的瞬间,从而达到“无缝”滚动的目的. 代码如下: <DIV id=demo…

myslide 插件开发知识点总结和 css3 动画性能问题的研究

myslide 插件开发知识点总结和 css3 动画性能问题的研究这篇文章主要是总结最近开发过程中遇到的问题.有几个问题又是不容易发现原因的问题,但是最后的结果又是很简单的. 1.手机端的 slider 插件是否有必要集成点按操作对于我自己开发的版本来说还是集成了这个操作的.但是参考了京东,天猫,淘宝电商网站首页的 slider 图片轮播插件都没有支持点按操作.那么是为什么呢? 我想到的答案可能如下: 对于移动端来说,屏幕太小,轮播图上的显示当前图片状态的圆点,人的手指不容易选中. 2.th…

wepy原理研究

像VUE一样写微信小程序-深入研究wepy框架 https://zhuanlan.zhihu.com/p/28700207 wepy原理研究虽然wepy提升了小程序开发体验,但毕竟最终要运行在小程序环境中,归根结底wepy还是需要编译成小程序需要的格式,因此wepy的核心在于代码解析与编译.wepy项目文件主要有两个: wepy-cli:用于把.wpy文件提取分析并编译成小程序所要求的wxml.wxss.js.json格式 wepy:编译后js文件中的js框架 wepy编译过程拆解过程核心…

input屏蔽历史记录 ;function($,undefined) 前面的分号是什么用处 JSON 和 JSONP 两兄弟 document.body.scrollTop与document.documentElement.scrollTop兼容 URL中的# 网站性能优化前端必知的ajax 简单理解同步与异步那些年，我们被耍过的bug——has

input屏蔽历史记录设置input的扩展属性autocomplete 为off即可 ;function($,undefined) 前面的分号是什么用处 ;(function($){$.extend($.fn...现般在一些 JQuery 函数前面有分号,在前面加分号可以有多种用途:1.防止多文件集成成一个文件后,高压缩出现语法错误.2.这是一个匿名函数,一般js库都采用这种自执行的匿名函数来保护内部变量 (function(){})().3.因为undefined是window的属性…

闲来无聊，研究一下Web服务器的源程序

web服务器是如何工作的 1989年的夏天,蒂姆.博纳斯-李开发了世界上第一个web服务器和web客户机.这个浏览器程序是一个简单的电话号码查询软件.最初的web服务器程序就是一个利用浏览器和web服务器软件之间的联系,将存储在硬盘上的文件传递给远程的读者. web服务器软件主要是提供web服务的软件,为浏览器提供http数据的支持. 它无非就是把硬盘上的文件以http数据流的形式提供给web服务器,这就是它的基本用途.这个基本用途就是作为web服务器软件的发明人蒂姆.博纳斯-李发明web服…

SQLSERVER聚集索引与非聚集索引的再次研究（上）

SQLSERVER聚集索引与非聚集索引的再次研究(上) 上篇主要说聚集索引下篇的地址:SQLSERVER聚集索引与非聚集索引的再次研究(下) 由于本人还是SQLSERVER菜鸟一枚,加上一些实验的逻辑严谨性, 单写<SQLSERVER聚集索引与非聚集索引的再次研究(上)>就用了12个小时,两篇文章加起来最起码写了20个小时, 本人非常非常用心的努力完成这两篇文章,希望各位看官给点意见o(∩_∩)o 为了搞清楚索引内部工作原理和结构,真是千头万绪,这篇文章只是作为参考,里面的观点不一定正确有…

深入研究Visual studio 2017 RC新特性

在[Xamarin+Prism开发详解三:Visual studio 2017 RC初体验]中分享了Visual studio 2017RC的大致情况,同时也发现大家对新的Visual Studio很是感兴趣.于是发时间深入研究了一下Visual Studio 2017RC 是不是和微软Connect()://2016上说得一样神. 总共列出了12点,耐心点慢慢看! 1,添加了不少[代码样式]的设置项目. 通过合理的设置每个人都能写出优美的代码,而且团队项目也可以达到统一代码风格. this首选…

【初码干货】使用阿里云对Web开发中的资源文件进行CDN加速的深入研究和实践

提示:阅读本文需提前了解的相关知识 1.阿里云(https://www.aliyun.com) 2.阿里云CDN(https://www.aliyun.com/product/cdn) 3.阿里云OSS(https://www.aliyun.com/product/oss) 4.HTTPS(http://baike.baidu.com/view/14121.htm) 阅读目录结构引: 一.准备工作二.整体功能结构三.具体实现步骤四.关键点和问题处理五.延伸与扩展六.总结与思考引:…

对一致性Hash算法，Java代码实现的深入研究

一致性Hash算法关于一致性Hash算法,在我之前的博文中已经有多次提到了,MemCache超详细解读一文中"一致性Hash算法"部分,对于为什么要使用一致性Hash算法.一致性Hash算法的算法原理做了详细的解读. 算法的具体原理这里再次贴上: 先构造一个长度为232的整数环(这个环被称为一致性Hash环),根据节点名称的Hash值(其分布为[0, 232-1])将服务器节点放置在这个Hash环上,然后根据数据的Key值计算得到其Hash值(其分布也为[0, 232-1]),接着在…

SQLSERVER聚集索引与非聚集索引的再次研究（下）

SQLSERVER聚集索引与非聚集索引的再次研究(下) 上篇主要说了聚集索引和简单介绍了一下非聚集索引,相信大家一定对聚集索引和非聚集索引开始有一点了解了. 这篇文章只是作为参考,里面的观点不一定正确上篇的地址:SQLSERVER聚集索引与非聚集索引的再次研究(上) 下篇主要说非聚集索引先上非聚集索引的结构图先创建Department8表 --非聚集索引 USE [pratice] GO CREATE TABLE Department8( DepartmentID ,) NOT NULL…

开源Word读写组件DocX 的深入研究和问题总结

一. 前言前两天看到了asxinyu大神的[原创]开源Word读写组件DocX介绍与入门,正好我也有类似的自动生成word文档得需求,于是便仔细的研究了这个DocX. 我也把它融入到我的项目当中并进行了实践.工具果然牛叉,但也有一些问题,后边一并列出来. 二. DocX的基本原理 Word有一个开放的文件格式,叫做Office Open XML.Office 从2007版本开始用它.它的基本方法是将文本和格式存储成xml,把其他资源(图片等)存储成独立文件,并将其进行Zip压缩.这样的好处是它…

【移动端兼容问题研究】javascript事件机制详解（涉及移动兼容）

前言这篇博客有点长,如果你是高手请您读一读,能对其中的一些误点提出来,以免我误人子弟,并且帮助我提高如果你是javascript菜鸟,建议您好好读一读,真的理解下来会有不一样的收获在下才疏学浅,文中难免会有不同程度的错误,请您指正留言 PS:事件阶段一节请看最新博客,之前理解有误 javascript事件基础我们的网页之所以丰富多彩并具有交互功能,是因为我们的javascript脚本语言,而javascript与HTML之间的交互又是通过事件机制实现的所以,事件是javascript一…

Oracle研究专题：Oracle系统安装与配置

最近开始研究Oracle数据库,盖因公司的系统要么Oracle要么是mysql吧. 作为一个IT工作者,没有碰过Oracle是一件很匪夷所思得事情. 想到过去几年,乃至接触IT行业开始就只有玩过sql server,是太low了. 所以从现在开始要好好学一下Oracle数据库,不仅是plsql的开发,还要学会Oracle的调优与配置. 于是乎从Oracle网上下载下来两个文件:数据库和客户端数据库地址:http://www.oracle.com/technetwork/database/ent…

CWMP开源代码研究5——CWMP程序设计思想

声明:本文涉及的开源程序代码学习和研究,严禁用于商业目的. 如有任何问题,欢迎和我交流.(企鹅号:408797506) 本文介绍自己用过的ACS,其中包括开源版(提供下载包)和商业版(仅提供安装包下载,没有源码) 参考: 1) http://www.docin.com/p-1306443672.html 2) http://www.easycwmp.org/ 一. 背景程序设计的思想来自于easycwmp官网,看过或者用过easycwmp的工程师应该都知道,该开源代码还有商业版,而且价格不…

Javascript判断object还是list/array的类型（包含javascript的数据类型研究）

前提:先研究javascript中的变量有几种,参考: http://www.w3school.com.cn/js/js_datatypes.asp http://glzaction.iteye.com/blog/1285147 测试1: typeof关键字 var obj= {test:'test'}; typeof obj;//输出object var list = [{test:'test'}]; typeof list;//输出object var str = 'str'; typeof…

在firefox浏览器下，scrollTop始终为0的问题

firefox下,带dtd文档申明: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> 的页面不支持document.body.scrollTo…

iOS coredata 数据库的加密（待研究）

https://github.com/project-imas/encrypted-core-data 使用起来很方便,底层还是使用了SQLCipher,有时间要研究一下! 数据库的密码不能用固定字符串,我这里用的是timeInterval函数,生成的当前秒数字符串,并利用 https://github.com/kishikawakatsumi/UICKeyChainStore 保存到keychain,确保安全.…

对html与body的一些研究与理解

by zhangxinxu from http://www.zhangxinxu.com本文地址:http://www.zhangxinxu.com/wordpress/?p=259 一.写在前面的最近一直构思着写篇关于html标签的文章,虽说之前处理过html标签,也解决过不少棘手的问题,但是对其理解还不是很透彻,很多原理都是自己推测的.在网上查阅相关资料想整合一下相关的信息,发现深入探讨html,与body的文章很少,只有在蓝色理想看到一篇“一叶千鸟”的这篇“正确认识html与body”有点…

【转贴】Python处理海量数据的实战研究

最近看了July的一些关于Java处理海量数据的问题研究,深有感触,链接:http://blog.csdn.net/v_july_v/article/details/6685962 感谢July ^_^ 他用的是Java的Hash Map等方法做了处理,讲解的非常深刻入骨我也一时兴起,想拿Python试试刀,看看Python对于海量数据的处理能力如何.无奈在百度和Google输入“Python 海量数据”都无果.可能是国内使用python的不多,用python处理海量数据的就更少了.不过这浇灭…

offsetTop、clientTop、scrollTop、offsetTop属性

HTML精确定位:scrollLeft,scrollWidth,clientWidth,offsetWidth scrollHeight: 获取对象的滚动高度. scrollLeft:设置或获取位于对象左边界和窗口中目前可见内容的最左端之间的距离 scrollTop:设置或获取位于对象最顶端和窗口中可见内容的最顶端之间的距离 scrollWidth:获取对象的滚动宽度 offsetHeight:获取对象相对于版面或由父坐标 offsetParent 属性指定的父坐标的高度 offsetLeft:…

防刷票机制研究和.NET HttpRequest Proxy

最近应朋友之约测试他做的投票网站防刷票机制能力如何,下面有一些心得和体会. 朋友网站用PHP写的,走的是HttpRequest,他一开始认为IP认证应该就差不多了.但说实话这种很low,手动更换代理服务器手动刷都可以.但程序员的手就是程序,于是, 首先先百度到一些免费代理服务器,非常多网站分享这些.按一定格式来储存到TXT文件. 第二步使用Fiddler来进行截取消息,拿到其http request header和body: 第三步使用.NET HTTPREQUEST.逻辑是遍历代理t…

Fiddler调式使用知多少(一)深入研究

Fiddler调式使用(一)深入研究阅读目录 Fiddler的基本概念如何安装Fiddler 了解下Fiddler用户界面理解不同图标和颜色的含义 web session的常用的快捷键了解web Session上下文菜单 Fiddler如何捕获firefox中的会话 Fiddler如何捕获Https会话 Fiddler的HTTP统计视图移动开发如何使用fiddler调式代码回到顶部 Fiddler的基本概念: Fiddler是一款基于windows系统的代理服务器软件,本地运行的程序…

【对scrollTop的研究】的更多相关文章