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

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

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

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

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

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

全屏背景滚动

基于HTML5的炫酷个人网站模板
  背景
 77354  1079

jQuery颜色选择器ColorPicker

ColorPicker基于强大的jQuery,使用方便、配置简单,同时不需要加载额外的CSS文件。可以随心所欲的使用到项目中,兼容各大浏览器。
  背景
 72656  335

京东产品详细页图片放大效果

京东商城详细页产品图片列表以及放大镜效果 兼容ie6+,谷歌,火狐
  背景
 50799  500

超简单的背景循环插件JoynBackground

使用超简单,代码仅1句,改变参数就可以了。
  背景
 60112  636

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

    先森□不滕不?可否 0
    2024/6/25 11:50:52
    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
        可以的
    回复
😃
  • 😀
  • 😉
  • 😥
  • 😵
  • 😫
  • 😘
  • 😡
  • 👍
  • 🌹
  • 👏
  • 🍺
  • 🍉
  • 🌙
  • 💖
  • 💔
😃
  • 😀
  • 😉
  • 😥
  • 😵
  • 😫
  • 😘
  • 😡
  • 👍
  • 🌹
  • 👏
  • 🍺
  • 🍉
  • 🌙
  • 💖
  • 💔
取消回复