作品展示

To be continue

淘宝首页规划

June 2014

1,使用定位、浮动、背景图片处理完成页面布局

2,使用源生JS完成页面中主要的JS效果

3,处理IE6下的兼容问题

CANVAS模仿Matrix片头

June 2014

1,生成一定数量的数组,循环分组分配X、Y值

2,定时器不停重复生成文字分配给数组内每个值

3,同时用CANVAS写入文字,不停改变Y值,反复重新绘制

JS贪吃蛇小游戏

May 2014

1,JS生成地图,定时器控制蛇身前进,把蛇的每个位置存入数组,每次前进进行数组操作

2,用事件处理键盘方向控制,每次碰撞苹果把苹果并入蛇的数组,再在排除蛇的位置随机生成苹果,重新启动定时器,达到越来越快的效果

3,做出各种情况判断检测

手机菜单弹出小效果

June s2014

1,模拟了手机点击弹出收缩一个菜单的效果

2,使用了多段函数执行实现变化过程

3,使用CSS旋转角度完成转圈

放大镜小效果

June 2014

1,鼠标事件处理鼠标移入出现一个随鼠标移动的透明层

2,事件属性提取透明层所选取的坐标位置

3,计算选取图片中的坐标位置生成在后侧位置

仿荣事达网站视觉差小效果

June 2014

1,事件属性提取各个元素长宽,计算元素起始位置

2,鼠标移动事件计算各个元素分别以不同的速度跟随鼠标改变定位的TOP和LEFT值

3,BOM操作处理窗口改变,使元素依然处在居中位置

即将到来

????

coming soon

About me
这是自我介绍

熟悉HTML+CSS布局,熟练制作兼容主流浏览器的页面、掌握页面各种常见的动画与交互效果。熟练使用源生JS,能够使用源生JS进行面向对象的组件开发。对DOM兼容性、BOM操作、cookie操作、Ajax前后台数据交互、JSONP的跨域请求方案等能够熟练运用。对HTML5、CSS3有一定的理解和使用经验。
    做事认真、耐心,细致,具有良好的团队合作精神。能在压力下较好完成任务。兴趣广泛,有极强的学习能力和理解能力,善于接受新鲜事物。实用主义者,喜欢做的事有很大意义;完美主义者,希望可以把东西做的更好更优而不仅仅只是达到目的;有求知欲,比起知其然,更希望知其所以然。对前端及IT行业有极高的兴趣和关注,并在不断学习。

About site
这是简介

本站制作使用了较多CSS3效果,由于某些内容只有WebKit内核支持,只做了chorme浏览器的兼容处理。导航处使用了font-face进行了字体处理,平常状态使用了字体阴影效果,移入后背景用transition改变,去掉阴影,使用background:-webkit-gradient、-webkit-text-fill-color和-webkit-background-clip的结合实现字体渐变;所有的展示DIV运用了2D旋转和3D旋转,在点击上处理了井深,Z层高度的问题;所有的DIV定位使用了CSS3的平移和缩放;点击从侧向变为正向使用了transition进行变换;点击更换层级使用了自己写的CSS3处理函数,完成对style函数返回值矩阵的操作;右侧文字标题使用函数将文字全部转为span包裹,进行运动处理,中间时间进行了透明度渐入效果处理,下部文字描述对每行的h3进行渐入运动处理;最下面的链接与层级运动一样,使用了CSS3处理函数来改变缩放。hover状态做了一个CSS3动画。

Gratitude
这是鸣谢

首先感谢各位老师在我学习期间对我各种问题不厌其烦的耐心指导。感谢制作过程中特邀UE设计师LEO和UI射即湿吴启铸对我的全力协助。最后感谢2个月来班里的同学,一起创造了一个很好的学习气氛和讨论环境。这个作品的完成,也我的一半,也有大家的一半。