浮华夕颜

2020年5月29日

<ul class="nav"> <li> <a href="#">微博</a> <ul> <li> <a href="#">私信</a> </li> <li> <a href="#">评论/a> </li> <li> <a href="#">@我</a> </li& Read More

posted @ 2020-05-29 00:39 浮华夕颜 Views(376) Comments(0) Diggs(0) Edit

jQuery的基本使用

1. jQuery概述 ① JavaScript库仓库：可以把很多东西放到这个仓库里面，东西只需要到仓库里面查找到就可以了。 JavaScript库：即library，是一个封装好的特定的集合（方法和函数）。从封装一大堆函数的角度理解库，就是在这个库中，封装了很多预先定义好的函数在里面，比如动画a Read More

posted @ 2020-05-29 00:09 浮华夕颜 Views(158) Comments(1) Diggs(0) Edit

2020年5月28日

案例：移动端返回顶部效果

实现功能：页面滚动某个地方就显示，否则隐藏点击可以返回顶部下面详细地说明具体的实现步骤： ① 滚动到某个地方后显示 ② 事件：使用scroll页面滚动事件 ③ 如果被卷去的头部（window.pageYOffset）大于某个数值 ④ 点击返回顶部的图片，使用window.scroll(0, 0 Read More

posted @ 2020-05-28 22:06 浮华夕颜 Views(1451) Comments(0) Diggs(0) Edit

移动端轮播图（原生JS写法）

移动端轮播图功能和PC端基本一致。实现功能：可以自动播放图片手指可以拖动播放轮播图下面详细地说明具体的实现步骤： 1. 自动播放功能： ① 开启定时器 ② 移动端移动可以使用CSS3的translate移动。注意，使用translate不需要添加就可以移动 ③ 想要图片优雅的移动，就需要添 Read More

posted @ 2020-05-28 17:55 浮华夕颜 Views(3592) Comments(0) Diggs(2) Edit

移动端特效

从以下4个方面介绍移动端特效：触屏事件移动端常见特效移动端常用开发插件移动端常用开发框架 1. 触屏事件移动端浏览器兼容性较好，我们不需要考虑以前JS的兼容性问题，可以放心的使用原生JS书写效果，但是移动端也有自己独特的地方。比如触屏事件touch（也称触摸事件），Android和IOS都 Read More

posted @ 2020-05-28 17:32 浮华夕颜 Views(498) Comments(0) Diggs(0) Edit

本地存储

随着互联网的快速发展，基于网页的应用越来越普遍，同时也变得越来越复杂，为了满足各种各样的需求，会经常性在本地存储大量的数据，HTML5规范提出了相关解决方案。本地存储特性： ① 数据存储在用户浏览器中 ② 设置、读取方便、甚至页面刷新不丢失数据 ③ 容量较大，sessionStorage约5M、l Read More

posted @ 2020-05-28 01:18 浮华夕颜 Views(117) Comments(0) Diggs(0) Edit

2020年5月27日

PC端网页特效

从下面5个方面介绍PC端的网页特效：元素偏移量offset系列元素可视区client系列元素滚动scroll系列动画函数封装常见网页特效案例 1. 元素偏移量offset系列 offset翻译过来就是偏移量，我们使用offset系列相关属性可以动态的得到该元素的位置（偏移）、大小等。获得 Read More

posted @ 2020-05-27 00:50 浮华夕颜 Views(359) Comments(0) Diggs(0) Edit

案例：网页轮播图

轮播图也称为焦点图，是网页中比较常见的网页特效。功能需求： 1. 鼠标经过轮播图模块，左右按钮显示，鼠标离开则隐藏左右按钮。 2. 点击右侧按钮一次，图片往左播放一张，以此类推，左侧按钮同理。 3. 图片播放的同时，下面小圆圈模块跟随一起变化。 4. 点击小圆圈，可以播放相应图片。 5. 鼠标不经 Read More

posted @ 2020-05-27 00:22 浮华夕颜 Views(1097) Comments(0) Diggs(0) Edit

2020年5月26日

案例：筋斗云案例

实现功能： ① 鼠标经过某个小li，筋斗云跟着到当前小li的位置 ② 鼠标离开这个小li，筋斗云就复原为原来的位置 ③ 鼠标点击了某个小li，筋斗云就会留在点击这个小li的位置具体实现思路如下：利用动画函数做该动画效果原先的筋斗云的起始位置是0 鼠标经过某个小li，就把当前小li的offset Read More

posted @ 2020-05-26 00:50 浮华夕颜 Views(1453) Comments(0) Diggs(0) Edit

2020年5月25日

案例：鼠标移动到小盒子上时，会有盒子从右边滑动出来，鼠标一离开，向左边滑动过去

这个案例功能是模仿京东的一个小功能，如下图所示：鼠标移动到箭头时，问题反馈这个盒子从右边滑动出来，鼠标一离开，向左边滑动过去  <style> .sliderbar { position: fixed; right: 0; bottom: 100px; width: 4 Read More

posted @ 2020-05-25 23:19 浮华夕颜 Views(731) Comments(0) Diggs(0) Edit

公告