摘要: 前言 vue1.0版本和2.0版本的过渡系统改变还是蛮彻底的,具体请自行详看文档介绍: "https://vuefe.cn/v2/guide/migration.html 过渡" 。在使用2.0版本做过渡效果的时候,虽然比1.0版本强大很多,但是实践过程中还是踩了一些不应该踩但是还是踩了的坑。虽然官阅读全文
posted @ 2016-12-18 13:00 郭锦荣 阅读(39252) 评论(9) 编辑
摘要: 前言明天就放假了,趁着今晚的空挡时间来写这篇博客——这是我昨晚实现的一个简单的CSS3动画效果。话说还得缘起我逛了一下站酷网,然后不小心看到了一张皮卡丘的手机壁纸,觉得很可爱,然后觉得这种效果是可以用CSS3来实现的,于是带着好感就实现了它。至于原图吧,为了不影响大家对我实现的动画产生对比,我就有心...阅读全文
posted @ 2015-09-02 23:21 郭锦荣 阅读(3081) 评论(5) 编辑
摘要: 前言 今天分享一下我昨晚做的CSS3动画效果——卡通场景汽车动画。在接触CSS3动画之前,我之前实现一些简单的动画效果都是使用flash完成的。但是自从CSS3横空出世,在移动端对CSS3动画的运用越来越多。今天这个分享是PC端的案例,因为我做的是大场景来的,起因还是我无意间看到一张卡通图片。于是我阅读全文
posted @ 2015-08-13 00:44 郭锦荣 阅读(4483) 评论(3) 编辑
摘要: 今天把之前分享的两篇博客《CSS3实现10种Loading效果》和 《CSS3实现8种Loading效果【二】》整理了一下。因为之前所分享的各种loading效果都只是做了webkit内核浏览器的兼容性而已,但初衷还是想做成PC端的效果,所以就统一把所有效果都收集起来,并兼容各主流浏览器。最重要的是阅读全文
posted @ 2015-07-26 00:35 郭锦荣 阅读(4372) 评论(1) 编辑
摘要: 前言 移动网络带宽的快慢直接影响webapp应用体验效果的优差,其中加载图片是很耗流量的,所以对这一方面的性能优化是很需要的。一般对于那些小而多的图片(图标)都会采用sprite合并成一张图片来减少http的请求次数。而CSS3的出现,无疑在移动端对图标的优化有着比较大的帮助。为此,自己也琢磨使用C阅读全文
posted @ 2015-07-23 20:07 郭锦荣 阅读(5024) 评论(8) 编辑
摘要: 前言前两天我刚发布了一篇CSS3实现小黄人动画的博客,但是实现的CSS3动画是基于我在站酷网找到的一张小黄人的jpg格式图片,并自己用PS抠出需要实现动画的部分,最后才完成的动画效果。但是,其实我的初衷是想体验一下用图片做动画的赶脚,但是找不到素材,才无奈用了最笨的方法来满足自己的需求,本想勉强能看...阅读全文
posted @ 2015-07-19 16:13 郭锦荣 阅读(9416) 评论(14) 编辑
摘要: 昨晚用CSS3实现了几种常见的Loading效果,虽然很简单,但还是分享一下,顺便也当是做做笔记……第1种效果:代码如下: .loading{ width: 80px; heig...阅读全文
posted @ 2015-07-05 13:39 郭锦荣 阅读(33215) 评论(25) 编辑
摘要: 刚学习了这个案例,然后觉得比较好玩,就练习了一下。然后发现其实也不难,如果你经常使用PS或者Flash的话,应该就会知道画个叮当猫是很容易的事,至少我是这么觉得。但是,用CSS3画出来确实是第一次接触,所以很乐意去尝试一下,对于我这种菜鸟,确实是帮助不少,至少懂得如何去画一个简单的人物形象出来,再...阅读全文
posted @ 2015-04-22 17:04 郭锦荣 阅读(10987) 评论(27) 编辑
摘要: 打开知乎的[登录页](https://www.zhihu.com/#signin),就可以看到其背景有一个动效,看起来好像蛮不错的样子:这个效果使用canvas是不难实现的,接下来就一步一步地讲解并实现这个效果。阅读全文
posted @ 2017-05-07 17:57 郭锦荣 阅读(1024) 评论(2) 编辑
摘要: 前言 vue1.0版本和2.0版本的过渡系统改变还是蛮彻底的,具体请自行详看文档介绍: "https://vuefe.cn/v2/guide/migration.html 过渡" 。在使用2.0版本做过渡效果的时候,虽然比1.0版本强大很多,但是实践过程中还是踩了一些不应该踩但是还是踩了的坑。虽然官阅读全文
posted @ 2016-12-18 13:00 郭锦荣 阅读(39252) 评论(9) 编辑
摘要: 前言掐指一算,快两个月没写博客分享了。好吧,我就只是在准备校招而已。现在已经有满意的offer了,所以我就回来啦!这两个月过得挺煎熬也挺充实的。具体细说估计得长篇大论,我就不闲扯了。总之呢,越努力,越幸运!正文先看看制作出来的效果图:PS: 有人会说,这些东西实用性不强,没啥用。一开始我也是这么觉得...阅读全文
posted @ 2015-10-31 15:57 郭锦荣 阅读(1105) 评论(0) 编辑
摘要: 前言很不巧前天突然就感冒了,都怪自己吃太多饼干导致上火了。整个人都无精打采。本来想多做几个兔斯基表情的,但身体发热很难受。所以就只完成一个简单点的表情耍一耍。正文先看一下这个简单到不能再简单的小表情吧:这里我就直接分享代码吧:html结构: ...阅读全文
posted @ 2015-09-12 10:16 郭锦荣 阅读(3160) 评论(9) 编辑
摘要: 前言首先声明在这篇博客里我将不会细说每一个知识点(比如什么是BFC,什么是flex等等),我主要是总结一下自己对标题中所列三个知识点的一些方法。一、多栏自适应布局首先,在这里我将从最简单的两栏固定布局慢慢讲到多栏自适应布局。1.固定布局说到固定布局想必大家已经觉得无爱了,但我还是要简单地讲一下,下面...阅读全文
posted @ 2015-09-07 14:18 郭锦荣 阅读(1973) 评论(2) 编辑
摘要: 前言明天就放假了,趁着今晚的空挡时间来写这篇博客——这是我昨晚实现的一个简单的CSS3动画效果。话说还得缘起我逛了一下站酷网,然后不小心看到了一张皮卡丘的手机壁纸,觉得很可爱,然后觉得这种效果是可以用CSS3来实现的,于是带着好感就实现了它。至于原图吧,为了不影响大家对我实现的动画产生对比,我就有心...阅读全文
posted @ 2015-09-02 23:21 郭锦荣 阅读(3081) 评论(5) 编辑
摘要: 上一篇博客《CSS3弹性伸缩布局(一)——box布局》介绍了旧版本的box布局,而这篇博客将主要介绍最新版本的flex布局的基础知识。新版本简介新版本的Flexbox模型是2012年9月提出的工作草案,这个草案是由W3C 推出的最新语法。这个版本立志于指定标准,让新式的浏览器全面兼容,在未来浏览器的...阅读全文
posted @ 2015-08-30 13:42 郭锦荣 阅读(10882) 评论(1) 编辑
摘要: CSS3弹性伸缩布局简介2009年,W3C提出了一种崭新的方案----Flex布局(即弹性伸缩布局),它可以简便、完整、响应式地实现各种页面布局,包括一直让人很头疼的垂直水平居中也变得很简单地就迎刃而解了。但是这个布局方式还处于W3C的草案阶段,并且它还分为旧版本、新版本以及混合过渡版本三种不同的编...阅读全文
posted @ 2015-08-23 00:02 郭锦荣 阅读(27927) 评论(0) 编辑
摘要: 主题由于最近比较忙,自己也没有很充裕的时间可以去做比较丰富的分享。今晚我挤出时间来制作这几个很常用的CSS3网页小效果。最近写JS的时间比例比较多,不过我还是比较钟情于CSS3。所以我还是坚持分享一些实用的CSS3小例子。这次由于时间有限,就做了几个相对比较简单的例子。看一下吧!正文第一种效果:由于...阅读全文
posted @ 2015-08-20 00:19 郭锦荣 阅读(5051) 评论(5) 编辑
摘要: 前言 今天分享一下我昨晚做的CSS3动画效果——卡通场景汽车动画。在接触CSS3动画之前,我之前实现一些简单的动画效果都是使用flash完成的。但是自从CSS3横空出世,在移动端对CSS3动画的运用越来越多。今天这个分享是PC端的案例,因为我做的是大场景来的,起因还是我无意间看到一张卡通图片。于是我阅读全文
posted @ 2015-08-13 00:44 郭锦荣 阅读(4483) 评论(3) 编辑