three实现流场动画效果代码
代码语言:html
所属分类:动画
代码描述:three实现流场动画效果代码,结合SimplexNoise插件,实现磁场运动动画。
下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开
<!DOCTYPE html> <html lang="en" > <head> <meta charset="UTF-8"> <style> @font-face { font-family: GOSTAi; src: url("//repo.bfw.wiki/bfwrepo/font/GOSTtypeAitalic.ttf") format("truetype"); } * { margin: 0; padding: 0; box-sizing: border-box; } body{ background-color: teal; } canvas{ background-color: navy; position: absolute; left: calc(50% - 300px - 2vh); top: calc(50% - 400px - 2vh); border: 2vh solid aqua; border-radius: 100px; } #line1{ top: calc(50% - 440px); text-align: left; } #line2{ bottom: calc(50% - 430px); text-align: right; padding-right: 5vh; } .writing{ position: absolute; width: 600px; left:calc(50% - 300px); font-family: GOSTAi; -webkit-text-fill-color: white; font-size: 250px; pointer-events: none; mix-blend-mode: d.........完整代码请登录后点击上方下载按钮下载查看
网友评论0