虚拟运营商UED前端小组4月25号分享总结

1.css3卡牌翻转效果
css:
.animate{-webkit-perspective:1000;width:80px;height:100px;position:relative;overflow:hidden;}
.face{ rotateY(0deg); width:80px;height:100px;position:absolute;-webkit-backface-visibility: hidden;-moz-backface-visibility: hidden;-webkit-transition: all .25s linear ;-webkit-transform-style: preserve-3d;}
.back{background:green;-webkit-transform: rotateY(-180deg);width:80px;height:100px;}
.front{background:red;width:80px;height:100px;}
.animate:hover .front{-webkit-transform: rotateY(180deg);}
.animate:hover .back{-webkit-transform: rotateY(0deg);}
html:




2. 不声明第三个变量的值交换
算术方法
var a=10,b=12;
a=b-a;
b=b-a;
a=b+a;
位运算
var a=10,b=12;
a=a^b;
b=a^b;
a=a^b;
栈实现
var a=1,b=2;
a=[b,b=a][0];
3.Zen Coding基本使用

E 元素名称(div, p);
E#id 使用id的元素(div#content, p#intro, span#error);
E.class 使用类的元素(div.header, p.error.critial). 你也可以联合使用class和idID: div#content.column.width;
E>N 子代元素(div>p, div#footer>p>span);
E+N 兄弟元素(h1+p, div#header+div#content+div#footer);
EN 元素倍增(ul#nav>li5>a);
E$N 条目编号 (ul#nav>li.item-$5);