06 2017 档案

摘要:牛逼的 will-change属性 will-change属性可以提前通知浏览器我们要对元素做什么动画,这样浏览器可以提前准备合适的优化设置。这样可以避免对页面响应速度有重要影响的昂贵成本。元素可以更快的被改变,渲染的也更快,这样页面可以快速更新,表现的更加流畅。 举个例子,当对于素使用 CSS 3 阅读全文
posted @ 2017-06-29 15:16 ysx_小鱼 阅读(261) 评论(0) 推荐(0) 编辑
摘要:CSS3 -webkit-scrollbar滚动条皮肤美化实现,利用-webkit-scrollbar,-webkit-scrollbar-track,-webkit-scrollbar-thumb这2个属性设置不同样式的滚动条。 下面是5个滚动条样式。 css代码 阅读全文
posted @ 2017-06-19 15:38 ysx_小鱼 阅读(316) 评论(0) 推荐(0) 编辑
摘要:mouseover与mouseenter 不论鼠标指针穿过被选元素或其子元素,都会触发 mouseover 事件。只有在鼠标指针穿过被选元素时,才会触发 mouseenter 事件。 mouseout与mouseleave不论鼠标指针离开被选元素还是任何子元素,都会触发 mouseout 事件。只有 阅读全文
posted @ 2017-06-19 14:27 ysx_小鱼 阅读(188) 评论(0) 推荐(0) 编辑
摘要:setTimeout setTimeout() //- 在指定时间后执行代码clearTimeout() //- 取消 setTimeout(),clearTimeout()方法的参数必须是由setTimeout()返回的ID值。 注意: setTimeout() 和 clearTimeout() 阅读全文
posted @ 2017-06-14 19:09 ysx_小鱼 阅读(1340) 评论(0) 推荐(0) 编辑
摘要:一、前言兼目录索引 《天龙八部》里的虚竹小和尚之前可以说是和尚的先进人物与代表模范,各类清规戒律谨记与严守。但是,后来呢,花姑娘送到跟前,什么戒律都成了浮云,禁不住诱惑享乐去了。啊,我现在似乎有类似的感觉,本来不打算深究CSS3的一些属性的,但是其效果以及实际应用价值之诱惑实在巨大,还是抵挡不住,折 阅读全文
posted @ 2017-06-14 11:59 ysx_小鱼 阅读(301) 评论(0) 推荐(0) 编辑
摘要:一、一笔带过的前言 CSS中凡是牵扯到数值的基本上都与单位相关联,例如: .test{width:180px;} 平时我们再制作页面的时候用到的单位也就那么几个,而实际上CSS中的可用单位的数量多得惊人,尤其CSS3的出现更壮大了CSS单位家族。而本文就是简单展示下这些值这些单位。 二、CSS长度值 阅读全文
posted @ 2017-06-14 11:22 ysx_小鱼 阅读(586) 评论(0) 推荐(0) 编辑
摘要:一、N多的唠哩唠叨 CSS3中一些新的单位早在去年春暖花开的时候就介绍了,参见:CSS长度值及时间、频率、角度单位。显然,其中就提到了本文要感叹的单位vw, vh,见下图: 不过“我看见你”和“我触碰你”是不一样的。正好,机缘巧合,最近又与这两个单位想见。大致琢磨了下,貌似vh这个单位可以实现我以前 阅读全文
posted @ 2017-06-14 11:16 ysx_小鱼 阅读(556) 评论(0) 推荐(0) 编辑
摘要:vh:相对于视窗的高度,那么vw:则是相对于视窗的高度。 “视区”所指为浏览器内部的可视区域大小,即window.innerWidth/window.innerHeight大小,不包含任务栏标题栏以及底部工具栏的浏览器区域大小。 详细vh的用法,大家可以参考http://www.zhangxinxu 阅读全文
posted @ 2017-06-13 19:04 ysx_小鱼 阅读(967) 评论(0) 推荐(0) 编辑
摘要:页面结构 实现思路与大众方法类似,如图 每个section就是一页内容,它的大小充满了屏幕(红色区域),一个Container由多个section构成,我们通过改变container的位置,来达到页面切换的效果。container向下走,页面好像上移了,container向上走,页面就下移了。 事件 阅读全文
posted @ 2017-06-13 17:19 ysx_小鱼 阅读(699) 评论(0) 推荐(0) 编辑
摘要:附加事件 其中经我测试,IE/Opera属于同一类型,使用attachEvent即可添加滚轮事件。 /*IE注册事件*/ /*IE注册事件*/ if(document.attachEvent){ if(document.attachEvent){ document.attachEvent('onmo 阅读全文
posted @ 2017-06-13 17:12 ysx_小鱼 阅读(23317) 评论(0) 推荐(1) 编辑
摘要:前言 本文主要参考w3c资料,从底层实现原理的角度介绍了requestAnimationFrame、cancelAnimationFrame,给出了相关的示例代码以及我对实现原理的理解和讨论。 本文介绍 浏览器中动画有两种实现形式:通过申明元素实现(如SVG中的元素)和脚本实现。可以通过setTim 阅读全文
posted @ 2017-06-13 14:26 ysx_小鱼 阅读(1040) 评论(0) 推荐(1) 编辑
摘要:window是浏览器端的全部数据变量的引用。比如 window.window window window.jQuery 就是浏览器中的全局变量里的jQuery那为什么不写 jQuery 而是写 window.jQuery呢?你可以试试,直接jQuery然后回车,会报一个错误。而window.jQue 阅读全文
posted @ 2017-06-13 11:27 ysx_小鱼 阅读(4536) 评论(0) 推荐(0) 编辑
摘要:user-modify属性,用来控制用户能否对页面文本进行编辑。与标签的contentEditable属性类似。· -webkit-user-modify: read-only | read-write | read-write-plaintext-only 阅读全文
posted @ 2017-06-09 14:14 ysx_小鱼 阅读(1024) 评论(0) 推荐(0) 编辑
摘要:之前写过两篇开发中遇到的问题和解决方案。当时是CSS 和 JavaScript 分开写的。现在写这篇文章的时候感觉很多内容都是有内在联系的,所以不好分开。 给大家分享一下这半年来的感受吧: 知道和理解之间是有很大距离的。别人谈到一个知识点,能接上嘴并且能发表一下自己的意见,这叫知道。遇到问题能够想到 阅读全文
posted @ 2017-06-09 13:31 ysx_小鱼 阅读(239) 评论(0) 推荐(0) 编辑
摘要:第一:lazyLoad简介及作用: 网站性能优化的插件,提高用户体验。 页面如果有很多图片的时候,当你滚动到相应的行时,当前行的图片才即时加载的,这样子的话页面在打开只加可视区域的图片,而其它隐藏的图片则不加载。 第二:使用场合 涉及到图片,falsh资源,iframe,网页编辑器(CK),JS文件 阅读全文
posted @ 2017-06-08 16:00 ysx_小鱼 阅读(159) 评论(0) 推荐(0) 编辑
摘要:1、此博文图片样式引用腾讯网站,效果如下: 2、样式设置: 3、JS代码: 阅读全文
posted @ 2017-06-08 14:20 ysx_小鱼 阅读(151) 评论(0) 推荐(0) 编辑
摘要:一、手机上的触摸事件 基本事件: touchstart //手指刚接触屏幕时触发 touchmove //手指在屏幕上移动时触发 touchend //手指从屏幕上移开时触发 下面这个比较少用: touchcancel //触摸过程被系统取消时触发 每个事件都有以下列表,比如touchend的tar 阅读全文
posted @ 2017-06-02 11:58 ysx_小鱼 阅读(328) 评论(0) 推荐(0) 编辑

点击右上角即可分享
微信分享提示