css-doodle实现背景动画

代码语言:html

所属分类:背景

代码描述:css-doodle实现背景动画

代码标签: 动画

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

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

<style>
body {
    width: 100vmax;
    height: 100vmax;
    background-color: black;
    overflow: hidden;
    padding:0;
    margin:0;
  }
</style>

</head>
<body translate="no">
<css-doodle id="grid">
</css-doodle>

<script type="text/javascript" src="http://repo.bfw.wiki/bfwrepo/js/css-doodle.0.7.7.js"></script>
<script>
var grid = document.querySelector("#grid");
function getSource() {
  let dood = `:doodle {
  @grid: 11 / 100%;
  background-color:hsl(@rand(360), @r(50%,100%), @r(100%));
  }
  :container {
    --one: hsl(@r(360), @r(0.........完整代码请登录后点击上方下载按钮下载查看

网友评论0