工信部门备案网站获取的icp备案号,遵义仁怀网站建设,网站后台 二级域名,网站投放广告多少钱最近在做一个数据展示的页面#xff0c;老板想要的效果是数字滑动的显示。 所以想了一下实现了老板想要的效果。代码如下。 !DOCTYPE html
html langen
headmeta charsetUTF-8titlenumber/title…最近在做一个数据展示的页面老板想要的效果是数字滑动的显示。 所以想了一下实现了老板想要的效果。代码如下。 !DOCTYPE html
html langen
headmeta charsetUTF-8titlenumber/titlestyle*, html, body {margin: 0px;padding: 0px;}.o-div {width: 500px;margin: 100px;}h2 {height: 40px;background-color: #f5f5f5;position: relative;}span {width: 25px;display: inline-block;height: 40px;overflow: hidden;position: relative;}span:before {content: 0123456789;display: block;width: 25px;line-height: 40px;top: 0px;word-break: break-all;position: absolute;display: block;}span.num-2:before {transition: top 1.2s ease-in;top: -80px;}span.num-6:before {transition: top 1.2s ease-in;top: -240px;}/style
/head
bodydiv classo-divh2span idn1 classnum/spanspan idn2 classnum/span/h2/divscriptvar oS1 document.getElementById(n1);var oS2 document.getElementById(n2);setTimeout(function () {oS1.className oS1.className num-2;oS2.className oS2.className num-6;}, 1000)/script
/body
/html相信大家也都看得懂。
