javascript实现“消灭星星”简单版

单位里美术天天在手机上玩的游戏,现在也有web版了,就是略简单了点,大家可以自行完善!!游戏规则:双击颜色一样的星星[runcode]<!DOCTYPE html> <html> <head> <meta charset="utf-8" content="target-densitydpi=320,width=640,user-scal...

继续阅读 »

css中px和em,rem的区别

国内的设计师大都喜欢用px,而国外的网站大都喜欢用em和rem,那么三者有什么区别,又各自有什么优劣呢?PX特点 IE无法调整那些使用px作为单位的字体大小; 国外的大部分网站能够调整的原因在于其使用了em或rem作为字体单位; Firefox能够调整px和em,rem,但是96%以上的中国网民使用IE浏览器(或内核)。 px像素(Pixel)。相对长度单位。像素px是相对于显...

继续阅读 »

clientHeight/scrollHeight/offsetHeight的区别

这是一张经典的关于scroll,offset,client相关高度和宽度的示意图,有很多动画的基础基于这个,做个小记!页(内容)可见区域宽:document.body.clientWidth网页(内容)可见区域高:document.body.clientHeight 即页面浏览器中可以看到内容的这个区域的高度,一般是最后一个工具条以下到状态栏以上的这个区域,与页面内容无关。网页可见区域宽:d...

继续阅读 »

网页设计中的色彩心理学

玩过web的童鞋都知道,只要有良好的色彩搭配,即使一些细节不是那么完善,网页也会看起来很舒服,色彩不仅触动用户视觉感观,更会给用户的心理产生一定影响,今天看到一篇非常棒的关于网页色彩搭配的文章分享之作者 Jeremy Smith 是位顾问,曾帮多家公司做出适当转型,让其营利上升,来看看他有些什么秘诀。色彩影响人类心情与思考这件事情是真的,当眼睛看到某种颜色时,会将此讯息传回大脑的下视丘,经由...

继续阅读 »

图表设计的10大错误案例

图表一直是前端交互经常用到的一种表现形式,作为一名"靠谱"前端不仅仅是选择合适的图表类型,更要以一种容易理解的方式来呈现信息,设计出更直观的导航系统,让观众做尽可能减少理解方面的麻烦,做到一目了然。当然,并不是所有的前端都是数据可视化专家,这就是为什么大部分的图表看上去是那么滴糟糕,简直就是一坨屎!这里有10个数据可视化的案例,包括你可能犯的错误和快速修复补救的方法。错误1.混乱的饼图分割饼...

继续阅读 »