摘要: 今天做毕设时遇到了一个小问题,我做了一个tab导航栏,点击一个tab页其它tab页隐藏,这时候第一想法是使用display:none来控制显示隐藏,写了之后发现使用display会有一个问题,就是第二个tab页的轮播图是在页面渲染时获取第二个tab页中某个元素的宽度来做自适应效果,因为已经隐藏,宽度 阅读全文
posted @ 2017-06-09 15:55 heyujun- 阅读(31277) 评论(0) 推荐(1) 编辑
摘要: 要实现手机端横向滑动效果并不难,了解实现的原理及业务逻辑就很容易实现。原理:touchstart(手指按下瞬间获取相对于页面的位置)——》touchmove(手指移动多少,元素相应移动多少)。 接下来讲讲实现逻辑: 其实就是手指拖动列表向哪个方向移动多少像素,并设置左右拖动的边界值。 附上代码及注释 阅读全文
posted @ 2017-05-14 14:57 heyujun- 阅读(2019) 评论(0) 推荐(1) 编辑
摘要: localStorage是HTML5在在客户端存储数据的新方法,存储的数据没有时间限制。 localStorage的主要API: localStorage.setItem(key,value); key是保存数据的变量,value是保存的数据 localStorage.getItem(key); 读 阅读全文
posted @ 2017-05-08 13:42 heyujun- 阅读(1810) 评论(0) 推荐(0) 编辑
摘要: 之前学习的前端知识都只是局限于html+js编写的静态网页,所以前几天试着加上模拟数据把前端和后台串联起来。在这个demo中,我运用了node.js、koa及vue.js。首先我们需要了解node.js,简单的说 Node.js 就是运行在服务端的 JavaScript。node.js安装很简单,只 阅读全文
posted @ 2017-05-01 23:49 heyujun- 阅读(338) 评论(0) 推荐(0) 编辑
摘要: 想要适配手机端和pc端,有几种简单的方法,本人使用的是百分比分配的方法。 js代码: 想要兼容手机端,必须在<head></head>标签中加上<meta name="viewport" content="width=device-width,initial-scale=1,max-scale=1. 阅读全文
posted @ 2017-04-26 22:40 heyujun- 阅读(819) 评论(4) 推荐(0) 编辑
摘要: 星星闪烁的原理其实很简单: html代码: 星星闪烁静态效果图: 最后附上星星img图: 阅读全文
posted @ 2017-04-24 22:19 heyujun- 阅读(7136) 评论(1) 推荐(1) 编辑
摘要: 放大镜效果主要涉及3个鼠标事件: 1.onmouseover,鼠标移入浮动小方块和显示放大的区域显示; 2.onmousemove,鼠标移动,小方块和放大区域一起移动; 3.onmouseout,鼠标移除小方块和放大区域消失。 其实放大镜效果最主要的是小方块与放大区域的比例及位置: js代码: 效果 阅读全文
posted @ 2017-04-22 22:17 heyujun- 阅读(498) 评论(0) 推荐(0) 编辑
摘要: 今天学习了一个瀑布流加载效果,很多网站都有瀑布流效果,瀑布流就是很多产品显示在网页上,宽相同,高度不同,表现为多栏布局,随着页面滚动条向下滚动,这种布局还会不断加载数据块并附加至当前尾部。原理是:1.设定一行中的列数;2.取第一行中每一个div的高度并把每一个高度放进一个数组中;3.算出数组中最小高 阅读全文
posted @ 2017-04-21 21:09 heyujun- 阅读(985) 评论(0) 推荐(0) 编辑
摘要: 雪花飘落的效果实现步骤:1.使用setInterval定时器每800毫秒创建一个雪花;2.把每一个雪花作为参数传进动态下落的方法中即可。 js实现代码: 效果图如下: 这样雪花飘落的效果就做好了。有什么不足的地方请指正! 阅读全文
posted @ 2017-04-15 21:31 heyujun- 阅读(15636) 评论(3) 推荐(2) 编辑
摘要: 我们上网经常会遇到第一次需要登录而之后不用再登录的网站的情况,其实是运用了Cookie 存储 web 页面的用户信息,Cookie 以名/值对形式存储,当浏览器从服务器上请求 web 页面时, 属于该页面的 cookie 会被添加到该请求中。服务端通过这种方式来获取用户的信息。详细cookie教程可 阅读全文
posted @ 2017-04-13 14:43 heyujun- 阅读(436) 评论(0) 推荐(0) 编辑