原生js 10个小球碰撞特效

所属分类:其他-动画效果,杂项

 49928  381  查看评论 (28)
分享到微信朋友圈
X
原生js 10个小球碰撞特效 ie兼容8

小球碰撞特效。引用test.js文件。

我目前做的是10个小球同时出现,你也可以根据你的需要进行修改。

如果你想要小球随机出现的话,你只需要把58行的代码解注,然后57行的注释就行了。

这个写法还是很清晰的。 测试后的效果还是很不错的,各位也许会觉得代码挺长,

但是其思路还是蛮清晰的:

首先创建Screen类,并在Screen的构造函数中给出了球移动、碰撞所需的各种属性变量,如ballsnum、spring、bounce、gravity等等  然后用原型prototype给出相应的函数,如创建球,createBalls,球碰撞hitBalls,球移动moveBalls,给每个函数添加相应的功能、  

最后用按钮点击事件调用函数,仅此而已。只是我这里把点击的效果注释掉了,直接刷新页面就会随机改变,你下载了看就知道了

相关插件-动画效果,杂项

CSS3提交按钮动画特效

这个提交按钮效果有两组动画:当屏幕大于800px的时候是一个动画效果,当屏幕小于800像素的时候是另一种动画效果。缩放你的浏览器看看不同的提交按钮动画效果吧!
  动画效果
 44778  428

css3折纸效果

css3折纸效果
  动画效果
 41074  383

2018年华为官网双十一红包雨特效

2018年华为官网双十一红包雨特效,从一堆压缩的代码中整理出来比较费力,看JQ22上红包雨特效活动特效较少,发布给大家下载。
  动画效果
 33044  345

jQuery+three.js雪花飘落动画效果

这是一款给人3D立体空间感的jQuery+three.js雪花飘落动画效果,canvas绘制雪花下雪动画特效。
  动画效果
 39417  434

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

    北方有佳人 0
    2019/5/9 11:19:42
    hilda520 0
    2018/5/18 10:20:17
    大神请赐教,问题:使用该插件,页面首次打开,速到有时很快,有时正常。页面不关闭,重新打开新页面,速度不定,请问怎么解决 回复
    ﹃没有小葡萄的可爱╭ 0
    2017/12/7 10:07:51

    我想让一开始加载小球碰撞的速度慢点,怎么修改

    回复
    kiming 0
    2017/11/20 14:55:04

    真的不错~~

    我需要这样的功能,可以开发不?

    1,小球换成图片,图片分两组A,B

    2,拖动B组的图片到A组,触碰到某一个,就交换链接

    3,拖动A组的图片到B组,A组减少拖动的那个,B组增加拖动的那个

    回复
    堂Di 0
    2017/11/20 14:09:10
    0
    2017/9/11 17:47:28

    div里不可以添加内容吗

        The Wind Rises0
        2017/11/16 14:31:34

        你说的添加内容是加什么?

    回复
    凡是繁的烦 0
    2017/7/15 10:58:17

    问一下,怎样让鼠标悬浮在一个小球上时使该小球静止?

    回复
    17岁秀才想当画家 0
    2017/6/30 21:37:15

    多少可以下载啊?

    回复
    风起了 0
    2017/6/19 16:38:11
    漫步走过从前 0
    2017/6/13 16:41:20
    很厉害  对于小白刚入门的我  还是有点看不懂 回复
😃
  • 😀
  • 😉
  • 😥
  • 😵
  • 😫
  • 😘
  • 😡
  • 👍
  • 🌹
  • 👏
  • 🍺
  • 🍉
  • 🌙
  • 💖
  • 💔
😃
  • 😀
  • 😉
  • 😥
  • 😵
  • 😫
  • 😘
  • 😡
  • 👍
  • 🌹
  • 👏
  • 🍺
  • 🍉
  • 🌙
  • 💖
  • 💔
取消回复