threejs的3D粒子波浪(原创)

所属分类:UI,其他,输入-背景,动画效果,验证

 46042  323  查看评论 (34)
分享到微信朋友圈
X
threejs的3D粒子波浪(原创) ie兼容10

更新时间:2020-07-01 23:12:22

下载文件解压后,打开index.html即可在网页上看到效果,每个函数方法代码都有注释,基于threejs的粒子动效,可以根据代码里的注释来修改代码,不懂可以留言,看到都会回,主要就是通过threejs创建第一种粒子添加材质渲染到页面,再创建第二种带光柱的粒子,颜色大小可根据代码注释修改,通过随机数的判断用第二种粒子随机覆盖第一种粒子的材质即可达到波浪起伏随机粒子带光柱的效果

相关插件-背景,动画效果,验证

漂亮的全屏Slideshow幻灯滑块效果(jQuery)

漂亮的全屏Slideshow幻灯滑块效果(jQuery)
  背景
 41388  417

全屏背景图片

全屏背景图片简单好用
  背景
 57650  364

JavriptDesktop

一个漂亮的原生Javript桌面效果
  背景
 64177  506

首页大屏背景图平滑切换

首页大屏背景图平滑切换
  背景
 38786  388

讨论这个项目(34)回答他人问题或分享插件使用方法奖励jQ币 评论用户自律公约

    Ritzen 0
    2022/10/5 21:26:20
    大佬问下,我在页面上添加了一个iframe之后,动画就下移了,怎么让它们叠加一起呢
        小平安0
        2022/12/8 9:33:04
        可以看下z-index
    回复
    刘敢敢?? 0
    2022/4/1 19:35:31
    大佬,问一下threejs的版本号是多少啊
        小平安0
        2022/7/4 15:51:09
        好像是104吧,我记不太清了,你congsole.log一下
    回复
    冰鬼护 0
    2022/3/16 18:02:01
    大佬你好,请问要是想把这个效果单独放在页面的某个div里要怎么改参数? 回复
    安之若素。 0
    2022/1/24 17:24:38
    冒昧问一下,您用的这个three.js的版本号是多少呀? 回复
    ?? 0
    2021/11/12 15:48:42
    大佬 我想修改一下 但是不太会修改
        ??0
        2021/11/12 16:24:29
        我想让那个类似于蒲公英的形状变成箭头 如何改呀
        小平安0
        2021/12/14 16:02:51
        百度搜canvas怎么画箭头的,替换一下就行
    回复
    Serenity 0
    2021/6/24 10:05:36
    现在版本不对吧,ParticleCavasMaterial已经被删除了
        小平安0
        2021/7/1 16:38:48
        用我发布的threejs的版本就没问题,要是用其他版本的就找到相对应能替换的方法就行 了
        ¤224↑ね★0
        2021/11/3 23:38:01
        有什么替代方案吗?material不行,standardMaterial不行,basicMaterial不行,主要你用的ParticleCavasMaterial里有program回调,其他材质都没有,用你这个案例不知道咋改,qq530595274
        ¤224↑ね★0
        2021/11/3 23:42:16
        用material,standardMaterial,basicMaterial都不行,主要ParticleCavasMaterial有个program回调,其他材质没有,用你的案例的话不知道怎么改,企鹅530595274
        小平安0
        2021/12/14 16:01:12
        为什么要加你?先学学请教问题的方式再来问吧
    回复
    haian1996 0
    2021/6/22 12:23:50
    感谢大佬,很好看,
        小平安0
        2021/7/1 16:37:39
        哈哈哈哈哈,我还有进阶版的,更骚气
    回复
    五匹狼 0
    2021/6/16 16:23:09
    同问作者,我能修改背景颜色样式等参数,拿来商用吗?谢谢
        小平安0
        2021/6/21 8:43:07
        可以的,改的不一样就行
        五匹狼0
        2021/6/21 9:34:40
        十分感谢!
    回复
    CW 0
    2021/2/9 13:00:18
    你好,能接layui验证登录吗?
        CW0
        2021/2/9 13:04:27
        <body class="login-bg">
           
           <div class="login layui-anim layui-anim-up">
               <div class="message">用户登录</div>
               <div id="darkbannerwrap"></div>
               
               <form method="post" class="layui-form" >
                   <input name="username" placeholder="用户名"  type="text" lay-verify="required" class="layui-input" >
                   <hr class="hr15">
                   <input name="password" lay-verify="required" placeholder="密码"  type="password" class="layui-input">
                   <hr class="hr15">
                   <input value="登录" lay-submit lay-filter="login" style="width:100%;" type="submit">
                   <hr class="hr20" >
               </form>
           </div>
        
           <script>
               $(function () {
                   layui.use('form', function () {
                       var form = layui.form;
                       //监听提交
                       form.on('submit(login)', function (data) {
                           $.post('./action/User.php?action=login',data.field,function(res){
                               var result = JSON.parse(res);
                               if(result.code === 200){
                                   location.href = 'map.html'
                               }else{
                                   layer.msg(result.msg);
                               }
                           });
                           return false;
                       });
                   });
               })
        
           </script>
        小平安0
        2021/2/19 9:13:26
        可以的
    回复
    遇见青春遇见你 0
    2021/1/11 10:44:08
    为什么使用post表单提交不行?
        小平安0
        2021/1/23 9:33:54
        可以的,你自己哪里弄错了吧
    回复
😃
  • 😀
  • 😉
  • 😥
  • 😵
  • 😫
  • 😘
  • 😡
  • 👍
  • 🌹
  • 👏
  • 🍺
  • 🍉
  • 🌙
  • 💖
  • 💔
😃
  • 😀
  • 😉
  • 😥
  • 😵
  • 😫
  • 😘
  • 😡
  • 👍
  • 🌹
  • 👏
  • 🍺
  • 🍉
  • 🌙
  • 💖
  • 💔
取消回复