前几天做项目的时候,需要实现一个动态锚点的效果 如果是传统项目,这个效果就非常简单。但是放到 Vue 中,就有两大难题: 1. 在没有 jQuery 的 animate() 方法的情况下,如何实现平滑滚动? 2. 如何监听页面滚动事件? 在浏览了大量文章、进行多次尝试之后,终于解决了这些问题 期间主 ...
分类:
其他好文 时间:
2017-06-15 19:35:24
阅读次数:
892
如上图,.fb-box是一个大div,包含着页面上的所有元素,包括所看到的那个弹窗.dialog-img,并且设置了height:100%;-webkit-overflow-scrolling:touch; 但是这样设置,在ios上会有一个bug,页面滚动一定的距离后,点击了显示弹窗,再关闭的话,就 ...
分类:
移动开发 时间:
2017-06-13 17:08:03
阅读次数:
248
点击事件 移动端浏览器点击事件默认有300ms的延迟 移动端实现弹性滚动 安卓局部滚动 滚动条出现bug,解决方案:Android只是用全局滚动 模拟全局滚动,加上padding-top及padding-bottom 键盘定制 自动纠错关闭 ...
分类:
移动开发 时间:
2017-06-10 18:14:49
阅读次数:
204
$(window).scroll(function(){ var before = $(window).scrollTop(); $(window).scroll(function() { var after = $(window).scrollTop(); if (before<after) { ...
分类:
Web程序 时间:
2017-06-08 13:17:51
阅读次数:
235
一、好用的插件perfect-scrollbar 在项目中快速利用perfect-scrollbar 基础使用方法:npm安装perfect-scrollbar npm install perfect-scrollbar 可以直接在项目文件中引入对应的perfect-scrollbar.css和pe ...
分类:
其他好文 时间:
2017-06-07 09:58:23
阅读次数:
174
在页面子元素单一的情况下通过设置父元素的定位实现页面切换会比设置子元素简单 ...
分类:
Web程序 时间:
2017-06-04 15:50:38
阅读次数:
201
一、关于滚动显屏加载 常常会有这样子的页面,内容很丰富,页面很长,图片较多。比如说光棍节很疯狂的淘宝商城页面。或者是前段时间写血本买了个高档耳机的京东商城页面,或者是新浪微博之类。 这些页面图片数量多,而且比较大,少说百来K,多则上兆。要是页面载入就一次性加载完毕。乖乖,估计黄花都变成黄花菜了。所以 ...
分类:
Web程序 时间:
2017-06-03 14:09:55
阅读次数:
187
前提是定义了background-image属性,然后用background-attachment来指明背景图的位置是固定于视口的,还是随着包含块移动的。可简单理解为定义背景图片随滚动轴的移动方式。 取值: scroll:默认值,背景图相对于元素固定,背景随页面滚动而移动,即背景和内容绑定。 fix ...
分类:
其他好文 时间:
2017-05-26 23:37:33
阅读次数:
339
最近在做移动端项目的时候,使用iscroll4实现页面滚动效果,之后发现页面中的input,textarea等不能得到焦点,输入内容。 问题原因是: 使用iscroll之后,输入框无法聚焦,页面文字等无法复制, iscroll主要一直监听用户的touch操作和鼠标事件,所以把其余事件都屏蔽了,禁止了 ...
分类:
其他好文 时间:
2017-05-25 13:20:02
阅读次数:
273
Lazy Load 是一个用 JavaScript 编写的 jQuery 插件. 它可以延迟加载长页面中的图片. 在浏览器可视区域外的图片不会被载入, 直到用户将页面滚动到它们所在的位置. 这与图片预加载的处理方式正好是相反的.在包含很多大图片长页面中延迟加载图片可以加快页面加载速度. 浏览器将会在 ...
分类:
Web程序 时间:
2017-05-21 14:41:52
阅读次数:
460