![](https://img-blog.csdnimg.cn/20201014180756754.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
H5C3
安静的对折
这个作者很懒,什么都没留下…
展开
-
H5C3实现无缝轮播
我们可以使用H5C3的新属性来实现无缝轮播图,首先创建动画,然后使用动画属性,在将要轮播的图片复制一份,这样就可以实现图片的无缝轮播,但是这样实现有一个缺点那就是需要加载的图片更多了 * { padding: 0; margin: 0; } div {原创 2017-01-05 22:45:28 · 3388 阅读 · 0 评论 -
前端C3属性模仿支付宝咻一咻
使用c3的动画属性,来模拟支付宝的咻一咻功能,没有添加音频效果,可以使用H5的audio音频标签来实现音效播放 html, body { width: 100%; height: 100%; } body{ display: flex;原创 2017-01-08 23:12:08 · 704 阅读 · 0 评论 -
使用Html5实现手风琴案例
使用H5实现横向的手风琴功能 * { padding: 0; margin: 0; } div { width: 522px; height: 222px; margin: 50px auto;原创 2017-01-09 22:52:41 · 5244 阅读 · 0 评论 -
用canvas实现围绕旋转动画
使用canvas的convas来实现围绕旋转动画,外圈顺时针,里层逆时针代码demo链接地址 代码demo链接地址html文件 body { margin: 0; padding: 0; overflow: hidden; b原创 2017-01-14 23:23:46 · 5881 阅读 · 0 评论 -
使用canvas实现行走的小人动画
用canvas实现朝四个方向行走的小人,也可是使用键盘方向键操作行走的方向,其实就是用canvas不停的清除重画 canvas { border: 1px solid red; } 您的浏览器不支持canvas,请升级到最新的浏览器 var cas =原创 2017-01-15 16:47:01 · 11379 阅读 · 1 评论 -
使用纯CSS3实现转动时钟案例
使用纯CSS3属性来实现转动时钟 .box { width: 200px; height: 200px; border: 10px solid #ccc; border-radius: 110px; margin: 100px原创 2017-01-10 23:55:45 · 6326 阅读 · 0 评论 -
CSS3背景图片尺寸属性
1、background-origin 规定 background-position 属性相对于什么位置来定位a、padding-box 背景图像相对于内边距框来定位b、border-box 背景图像相对于边框盒来定位c、content-box 背景图像相对于内容框来定位2、background-clip 规定背景的绘制区域,也就是背景图片显示的区域a、border-box原创 2017-01-11 23:20:20 · 2570 阅读 · 0 评论 -
用js实现五子棋
思路:1、先用canvas画五子棋的棋盘2、获取鼠标点击的位置3、根据鼠标点击的位置判断,并画棋子4、根据下的棋子判断是否赢了 * { padding: 0; margin: 0; } canvas { margin: 10p原创 2017-01-11 23:49:46 · 852 阅读 · 0 评论