TweenMax实现数字变动动画效果代码
代码语言:html
所属分类:动画
代码描述:TweenMax实现数字变动动画效果代码
下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开
<!DOCTYPE html> <html lang="en" > <head> <meta charset="UTF-8"> <style> body { background: #e74c3c; color: white; font-family: Roboto, sans-serif; font-size: 120px; } .counter { position: relative; left: 60px; top: 40px; } .credit { position: fixed; bottom: 20px; left: 60px; font-size: 16px; } .counter-value { position: absolute; transform-origin: 0 100%; transform: skew(20deg, 0); overflow: hidden; padding-right: 30px; height: 1em; } .counter-value-mask { position: absolute; transform-origin: 0 100%; transform: skew(-20deg); overflow: hidden; line-height: 1em; } </style> </head> <body> <link href='https://fonts.googleapis.com/css?family=Roboto:300' rel='stylesheet' type='text/css'> <div class="counter"> </div> <script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/jquery.2.11.js"></script> <script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/TweenMax.min.js"></script> <script > $(.........完整代码请登录后点击上方下载按钮下载查看
网友评论0