jQuery黑客帝国 片头代码雨效果

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

 65106  742  查看评论 (50)
分享到微信朋友圈
X
jQuery黑客帝国 片头代码雨效果 ie兼容10

更新时间:2017/1/30 下午12:51:22

更新说明:修改了后面的数字,使生成各种稀奇古怪的字母,效果更好

String.fromCharCode(1e2 + Math.random() * 300);

① 用setInterval(draw, 33)设定刷新间隔

② 用String.fromCharCode(1e2+Math.random()*33)随机生成字母

③ 用ctx.fillStyle=’rgba(0,0,0,.05)’; ctx.fillRect(0,0,width,height); ctx.fillStyle=’#0F0′; 反复生成opacity为0.5的半透明黑色背景

④ 用x = (index * 10)+10;和yPositions[index] = y + 10;顺序确定显示字母的位置

⑤ 用fillText(text, x, y); 在指定位置显示一个字母 以上步骤循环进行,就会产生《黑客帝国》的片头效果。

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

three.js 创建 多面立方体

基于three.js 创建6面立方体模型 可旋转添加动画
  动画效果
 27596  313

点击效果Google Design 谷歌的设计团队

效果是 Google Design 也就是谷歌的设计团队博客用到了这个效果 , 当时的第一感觉就是 擦 ,google就是牛逼, 一个按钮点击也要酷到不要不要的了
  动画效果
 38626  500

3D签到墙 threejs(使用元素周期表修改)

采用threejs官方demo的元素周期更改的,展示为图片,可自动更换或手动更换,目前为旋转状态;模拟推送用户可以优化随机更改图片应该会更好点。
  动画效果
 69475  656

3Dtransfrom和animation的结合

一个学习css3transfm3D和animation的入门效果
  动画效果
 29886  464

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

    子鱼小窝 0
    2022/6/22 10:26:50
    不能设置为悬浮在某些图片上,背景会变成纯黑色 回复
    芊芊 0
    2019/4/11 17:32:24
    落 幕 0
    2018/1/12 20:46:49

    这个能设置成屏保吗?

        喜剧&演员0
        2018/2/3 22:49:39
        应该不可以哦
        z上帝之手z0
        2019/11/25 9:57:53
        浏览器打开,然后按F11就全屏了,差不多就是屏保的效果了
    回复
    0
    2017/12/26 16:17:41

    wa ku a ~~`

        夏至0
        2018/7/5 15:39:35
        真的很酷啊
    回复
    青云墨玉 0
    2017/12/22 17:22:59
    围墙 0
    2017/12/6 16:16:55
    可以设置他从下向上执行吗???? 回复
    . 0
    2017/11/1 15:35:04

    牛逼啊!!!!!!

    回复
    long 0
    2017/10/25 11:47:00
    金牛座 0
    2017/10/19 15:01:26
    MIX谢先生 0
    2017/10/18 14:47:12
😃
  • 😀
  • 😉
  • 😥
  • 😵
  • 😫
  • 😘
  • 😡
  • 👍
  • 🌹
  • 👏
  • 🍺
  • 🍉
  • 🌙
  • 💖
  • 💔
😃
  • 😀
  • 😉
  • 😥
  • 😵
  • 😫
  • 😘
  • 😡
  • 👍
  • 🌹
  • 👏
  • 🍺
  • 🍉
  • 🌙
  • 💖
  • 💔
取消回复