baoyadong - 博客园

回到顶部的几种写法

摘要：本文先详细介绍回到顶部的5种写法，然后对其实现功能增加，最后得到最终实现写法【1】锚点使用锚点链接是一种简单的返回顶部的功能实现。该实现主要在页面顶部放置一个指定名称的锚点链接，然后在页面下方放置一个返回到该锚点的链接，用户点击该链接即可返回到该锚点所在的顶部位置 [注意]关于锚点的详细信息移阅读全文

posted @ 2018-04-02 21:07 baoyadong 阅读(6787) 评论(0) 推荐(1) 编辑

深入理解元素视图的3个方法

摘要：本文主要介绍元素视图的三个方法，包括getBoundingClientRect()、getClientRects()和elementFromPoint() getBoundingClientRect()-- 判断一个元素的尺寸和位置最简单的方法就是使用getBoundingClientRect() 阅读全文

posted @ 2018-04-02 20:50 baoyadong 阅读(259) 评论(0) 推荐(0) 编辑

深入理解滚动scroll

摘要：滚动宽高 scrollHeight scrollHeight表示元素的总高度，包括由于溢出而无法展示在网页的不可见部分 scrollWidth scrollWidth表示元素的总宽度，包括由于溢出而无法展示在网页的不可见部分 [注意]IE7-浏览器返回值是不准确的【1】没有滚动条时，scrollH 阅读全文

posted @ 2018-04-02 19:57 baoyadong 阅读(228) 评论(0) 推荐(0) 编辑

[转]深入理解客户区尺寸client

摘要：关于元素尺寸，一般地，有偏移大小offset、客户区大小client和滚动大小scroll。前文已经介绍过偏移属性，后文将介绍scroll滚动大小，本文主要介绍客户区大小client 客户区大小客户区大小client指的是元素内容及其内边距所占据的空间大小 clientHeight clientH 阅读全文

posted @ 2018-04-02 19:01 baoyadong 阅读(355) 评论(0) 推荐(0) 编辑

IOS下的 click 点击失效

摘要：当委托给一个元素添加click事件时，如果事件是委托到 document 或 body 上，并且委托的元素是默认不可点击的(如 div, span 等)，此时 click 事件会失效。 demo: 解决办法解决办法有6种：将 click 事件直接绑定到目标元素(即 .target ) 上将目标阅读全文

posted @ 2018-04-02 17:22 baoyadong 阅读(361) 评论(0) 推荐(0) 编辑

[转]了解screen对象的常用视图属性

摘要：前面的话 screen对象基本上只用来表明客户端的能力，其中包括浏览器窗口外部的显示器的信息，如像素高度和宽度等。每个浏览器中的screen对象都包含着各不相同的属性。本文将详细介绍screen对象的常用视图属性 width width属性表示屏幕的像素宽度 height height属性表示屏幕的阅读全文

posted @ 2018-04-02 14:03 baoyadong 阅读(252) 评论(0) 推荐(0) 编辑

[转]深入理解定位父级offsetParent及偏移大小

摘要：偏移量(offset dimension)是javascript中的一个重要的概念。涉及到偏移量的主要是offsetLeft、offsetTop、offsetHeight、offsetWidth这四个属性。当然，还有一个偏移参照——定位父级offsetParent。本文将详细介绍该部分内容定位父级阅读全文

posted @ 2018-04-02 13:57 baoyadong 阅读(248) 评论(0) 推荐(0) 编辑

异步 I/O 和事件驱动

摘要：异步IO(asynchronous I/O) 首先来理解几个容易混淆的概念，阻塞IO(blocking I/O)和非阻塞IO(non-blocking I/O)，同步IO(synchronous I/O)和异步IO(synchronous I/O)。博主一直天真的以为非阻塞I/O就是异步I/O T 阅读全文

posted @ 2018-03-26 14:17 baoyadong 阅读(1066) 评论(0) 推荐(0) 编辑

Vue.extend用法

摘要： Vue.extend 是构造一个组件的语法器。用法 Vue.extend ( options )，options 是对象；使用基础Vue构造器，创建一个子类，参数是一个包含组件选项的对象，data选项是特例，它必须是函数。 1. 第一种用法--挂在到元素上输出如下： 2. 第二种用法--将组件阅读全文

posted @ 2018-03-23 16:33 baoyadong 阅读(4216) 评论(0) 推荐(0) 编辑

input输入框的input事件和change事件

摘要： input输入框的onchange事件，要在 input 失去焦点的时候才会触发；在输入框内容变化的时候不会触发change，当鼠标在其他地方点一下才会触发； onchange 事件也可用于单选框与复选框改变后触发的事件。 demo如下： onchange事件兼容性 onchange event 阅读全文

posted @ 2018-03-23 15:34 baoyadong 阅读(243162) 评论(1) 推荐(6) 编辑