2017年8月24日
碰撞检测原理
摘要： 一切的碰撞都是通过网页中x,y坐标来计算的，判断两个矩形是否发生碰撞，就是判断它们是否有重合部分。理论上是这样，但是实际上我们应该考虑什么时候不重合，因为这种逆向思维会简单很多，如果一味考虑什么时候重合，一般人很难理得清楚。所以我们先理清楚不重合的情况，那么反过来就是重合的情况了。 不重合的情况：1 阅读全文
posted @ 2017-08-24 09:39 \面朝阳光/ 阅读(1914) 评论(0) 推荐(0) 编辑
懒加载原理的实现
摘要： 实现原理： 1、对于img标签，只要将图片地址赋给src属性，浏览器解析的时候就会自动去请求图片地址所指向的资源，浏览器的这个机制我们是没办法改变的，那么我们只能在src属性上做文章，在刚开始的时候我们把图片地址赋给img标签一个自定义属性例如data-src，src属性留空。 2、设置一个定时器定 阅读全文
posted @ 2017-08-24 09:22 \面朝阳光/ 阅读(2659) 评论(0) 推荐(0) 编辑
jQuery图片延迟加载插件jQuery.lazyload 的使用
摘要： 使用方法 引用jquery和jquery.lazyload.js到你的页面 1 2 <script src="jquery-1.11.0.min.js"></script> <script src="jquery.lazyload.js?v=1.9.1"></script> 1 2 <script  阅读全文
posted @ 2017-08-24 09:06 \面朝阳光/ 阅读(197) 评论(0) 推荐(0) 编辑
2017年7月28日
重置默认样式 css reset
摘要： html { overflow-x:auto; overflow-y:scroll; } body, dl, dt, dd, ul, ol, li, pre, form, fieldset, input, p, blockquote, th, td { font-weight:400; margin 阅读全文
posted @ 2017-07-28 14:28 \面朝阳光/ 阅读(3445) 评论(0) 推荐(0) 编辑
40条常见的移动端Web页面问题解决方案
摘要： 1、安卓浏览器看背景图片，有些设备会模糊。想让图片在手机里显示更为清晰，必须使用2x的背景图来代替img标签（一般情况都是用2倍）。例如一个div的宽高是100100，背景图必须得200200，然后background-size:contain;，这样显示出来的图片就比较清晰了。代码可以如下：bac 阅读全文
posted @ 2017-07-28 13:55 \面朝阳光/ 阅读(126) 评论(0) 推荐(0) 编辑
2017年7月26日
从列表页跳转到详情定位
摘要： //列表页 $(function(){ $(".mean-item").on("tap","a",function(){ // $.cookie("activeIndex",$(this).data("index")); ... 阅读全文
posted @ 2017-07-26 14:38 \面朝阳光/ 阅读(174) 评论(0) 推荐(0) 编辑
2017年7月12日
简单返回顶部
摘要： 返回顶部 还是蒂萨 哎哎嗲搜的活塞偶会打死哦对哈斯哦对哈斯的哈市偶发的 哎哎嗲搜的活塞偶会打死哦对哈斯哦对哈斯的哈市偶发的... 阅读全文
posted @ 2017-07-12 15:43 \面朝阳光/ 阅读(170) 评论(0) 推荐(0) 编辑
低版本ie兼容问题的解决方案
摘要： CSS hack \9 所有的IE10及之前 * IE7以及IE7以下版本的 _ IE6以及IE6以下版本的 !important 提升样式优先级权重 1、ie6，7，8对H5标签兼容 页面中引入html5shiv.js，下载地址:https://github.com/aFarkas/html5sh 阅读全文
posted @ 2017-07-12 15:12 \面朝阳光/ 阅读(651) 评论(1) 推荐(1) 编辑
2017年7月10日
微信分享
摘要： https://github.com/JefferyWang/nativeShare.js https://github.com/JefferyWang/nativeShare.js/blob/master/demo.html 目前仅支持 uc和QQ浏览器 阅读全文
posted @ 2017-07-10 18:03 \面朝阳光/ 阅读(124) 评论(0) 推荐(0) 编辑
2017年7月9日
常见简单功能
摘要： <select id="slec"> <option>请选择</option> <option>1</option> <option>2</option> <option>3</option> <option>4</option> </select> <script type="text/javas 阅读全文
posted @ 2017-07-09 15:20 \面朝阳光/ 阅读(110) 评论(0) 推荐(0) 编辑