星球大战炫酷海报动态效果

代码语言:html

所属分类:动画

代码描述:星球大战炫酷海报动态效果

代码标签: 动态 效果

下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开


<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">


<style>
body {
  background-color: black;
  position: relative;
  --innerVH: 100vh;
  height: var(--innerVH);
}

.wrapper {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  overflow: hidden;
  display: grid;
  place-items: stretch center;
}

#skywalker {
  position: relative;
  height: 100%;
  overflow: hidden;
}

svg {
  display: block;
  height: 100%;
}

image {
  image-rendering: crisp-edges;
}

#bright--no-cracks,
.bright {

}

#lightsaber-glow--jedi--highlights,
#lightsaber-glow--jedi {
  -webkit-animation: lightside 20s infinite alternate;
          animation: lightside 20s infinite alternate;
}

#lightsaber-glow--jedi--highlights {
  mix-bl.........完整代码请登录后点击上方下载按钮下载查看

网友评论0