我是老大钦点的外门弟子

【今天完成的事情】

修改了任务5提交审核；昨天的计划，继续琢磨《Slide And Push Menus With CSS3 Transitions》这篇文章，感觉最重要就是transition这个属性，所以就去MDN看了一下，跟着例子试了一下。觉得还是了解得不够详细就去读了这篇《CSS Transitions and Transforms for Beginners》（https://robots.thoughtbot.com/transitions-and-transforms）为了让自己之后能更快速理解，就顺便自己试着把这篇文章翻译了下来。翻译之后才发现通读的时候会遗漏一些细节，然后对这个transition和transform属性有了一定的认识。也把里面的代码试一遍。

然后看了张鑫旭的博客的这篇文章《CSS3 Transitions, Transforms和Animation使用简介与应用展示》（http://www.zhangxinxu.com/wordpress/2010/11/css3-transitions-transforms-animation-introduction/）

然后还是把昨天的那篇代码跟着一点点敲下来，看得很疑惑，然后试着翻译下来这篇文章，有些地方依然不太理解，css那段还算能比较理解，js那段真的是一头雾水。所以我想要不放一放，先不做这部分。

【明天计划的事情】

1、看看任务5审核是否成功，没有就改的；然后修改一下任务6；再花两个小时在任务7的呼出菜单上，如果能有想法就去试试，试不出来就算了。

2、试着开始做任务8.

【遇到的问题】

记住这个呼出菜单现在没做出来的问题，每天花个固定的时间来解决他。

【收获】

 1、知道了transition是为了让改变可以有个平滑和渐变的过渡；

transition的简写：

  transition: [property] [duration] [timing-function] [delay];

  transition-property（指定了这个属性用在那个地方）和transition-duration（指定了这个属性的时间跨度）是必须要设置的，

  transition-timing（速度）和transition-delay（这个过渡在什么时候开始）这两项则是可以选择设置的。

2、还学到了transform里改变的不同方式，rotate（旋转）、move（移动用translate不同的XY值）、skew（倾斜）和scale（改变尺寸大小）；

还有transform-origin是用来改变原点的，比如rotate旋转的可以把原点设置成左上角（0% 0%或者left top），绕着左上角来旋转；

3、transform和transition在使用的时候给父元素加transition。

比如：这个例子里是在div里加，而不是伪类hover选择器。

div {

  transition: transform 1s;

}

div:hover {

  transform: scale(2);

}

我把这篇文章《CSS Transitions and Transforms for Beginners》自己瞎翻的内容放到这里了https://github.com/llllllllllar/translation/issues，以后如果有更深入的理解的话可能会时不时更改，我想通过这样也不失为一种学习的方式？当然了，肯定是没有直接代码来理解的快！

而且张鑫旭的博客的这篇文章《CSS3 Transitions, Transforms和Animation使用简介与应用展示》已经讲得很清晰和全面了，毕竟大神！