TweenMax.js背景位移动画

快来打我* 2022-06-02 11:10 221阅读 0赞

<!doctype html>
    <html>
    <head>
    <meta charset="utf-8">
    <title>背景动画</title>
    <style type="text/css">
    * {
    	margin: 0;
    	padding: 0;
    }
    .fibers {
    	display: block;
    	width: 275px;
    	height: 600px;
    	background: url(images/spectra-wire-sprite.png) no-repeat 0 0 transparent;
    }
    </style>
    </head>
    
    <body>
    <div class="fibers"></div>
    
    <script src="images/TweenMax.js"></script> 
    <script type="text/javascript">
    	var st=0;
    	TweenMax.set('.fibers',{ 
    	repeat:-1, backgroundPosition: '0px 0px',ease:Linear.easeNone,onComplete: function (){    
        for (var y = 0; y < 5; y++) {
            for (var x = 0; x < 10; x++) {
                TweenMax.to('.fibers',0,{x:10,delay:st+=0.1,backgroundPosition: '-' + (275 * x) + 'px -' + (600 * y) + 'px',ease:Linear.easeNone,onStart: function () {
                    
                }});
            }
        };
    }})
    	</script>
    </body>
    </html>

![20180111150514394][]

[20180111150514394]: /images/20220602/39ac6d67536a4acca1b5945d4054e019.png

发表评论取消回复

表情：

评论列表（有 0 条评论，221人围观）

还没有评论，来说两句吧...

相关阅读

相关 Android ParallaxViewPager：ViewPager背景视差Parallax移动

Android ParallaxViewPager：ViewPager背景视差Parallax移动附录的相关文章，实现了一种是当ViewPager左右滑动时候，背景

た入场券/ 2024年02月17日 16:40/ 0 赞/ 47 阅读

相关 vue移动端设置全屏背景

vue移动端项目设置全屏背景，关键是要找对文件，然后添加background属性即可，这里说的全屏背景，是指任意切换页面，背景都还是这个背景，那么只要在入口html文件或者全局

不念不忘少年蓝@/ 2023年10月11日 23:13/ 0 赞/ 41 阅读

相关移动端修改下拉框背景

移动端设置下拉框背景：找到下拉框控件，添加初始化后事件 setTimeout(function() \{ var dateEditor = docum

淡淡的烟草味﹌/ 2022年12月27日 08:36/ 0 赞/ 164 阅读

相关设置移动端网页端背景图片

下面展示一些 `内联代码片`。 <image class="image-bg" src="../../static/bgi4.png"/>

红太狼/ 2022年12月25日 04:50/ 0 赞/ 245 阅读

相关移动端背景图片自适应

移动端背景图片自适应 /兼容安卓手机没有高度导致无法显示背景图片/ body{ width:100vw; height:

绝地灬酷狼/ 2022年10月06日 00:45/ 0 赞/ 273 阅读

相关 CSS 背景background，精灵spirit(移动背景图位置来实现)

参考：[https://blog.csdn.net/houyanhua1/article/details/78387884][https_blog.csdn.net_houya

柔光的暖阳◎/ 2022年09月10日 08:27/ 0 赞/ 207 阅读

相关 TweenMaxJs三角形圆点加载js特效

[下载地址][Link 1]基于TweenMaxJs动画类库实现的三角形和圆点加载动画特效 ![1630271802.png][] dd: [Link 1]: http

约定不等于承诺〃/ 2022年09月09日 06:14/ 0 赞/ 147 阅读

相关 MFC设置对话框背景[bmp位图当背景]

步骤一：导入bmp文件：

小灰灰/ 2022年08月21日 10:00/ 0 赞/ 257 阅读

相关 TweenMax.js背景位移动画

<!doctype html> <html> <head> <meta charset="utf-8"> <title>背景动画</ti

快来打我*/ 2022年06月02日 11:10/ 0 赞/ 222 阅读

相关动态背景线条，鼠标移动线条汇聚---背景特效

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3UwMTI3

快来打我*/ 2022年04月13日 14:18/ 0 赞/ 303 阅读