什么叫h5项目_对移动端h5项目的一点总结

到现在也做了不少的h5，遇到了不少的坑，也对曾经的经验教训总结一下

到现在也做了不少的h5，遇到了不少的坑，也对曾经的经验教训总结一下。

主要做过的项目有：

每个项目都有这样那样的难点，现在都分别总结一下。

1. 智图派-腾讯财经

这个项目的亮点是进入到首页后，就是根据当前的时间，每一位都滚动到对应的数字。我实现的思路是：计算当前时间与设定好的时间节点之间的时间差；

将时间差转换为数组；

根据数组的位数，给每一位都填充上0-9这10个数字；

使用CSS3的transition和transform，获取每个数字的高度和当前位置的数字，计算出滚动的距离。

CSS：.timer .t{

font-size: 3rem;

line-height: 3rem;

border: 2px solid #a2a2a2;

height: 62px;

overflow: hidden;

display: inline-block;

margin-right: 4px;

}

.timer .t div{

-webkit-transition: -webkit-transform 800ms cubic-bezier(0.42, 0, 0.58, 1) 300ms;

-ms-transition: transform 800ms cubic-bezier(0.42, 0, 0.58, 1) 300ms;

transition: transform 800ms cubic-bezier(0.42, 0, 0.58, 1) 300ms;

}

.timer .t em{

padding: 7px 12px;

display: block;

font-style: normal;

}

HTML：

JS：(function(){

var left = '';

function set(){

var point = 1451577600, // 节点

now = parseIn