灯泡闪亮动画效果-html代码-BFW代码库

灯泡闪亮动画效果

代码语言：html

所属分类：动画

代码描述：灯泡闪亮动画效果

代码标签：效果

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

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

<style>
svg {
  width: 100vw;
  height: 100vh;
}

#bulb {
  fill-opacity: 0;
}

#lights path {
  fill-opacity: 0;
  stroke: #ffd15c;
  stroke-width: 4;
  stroke-dasharray: 150;
  stroke-dashoffset: 150;
}
</style>

</head>
<body translate="no">
<svg xmlns="http://www.w3.org/2000/svg" version="1.1" id="Layer_1" x="0" y="0" viewBox="0 0 512 512" xml:space="preserve">
<path id="bulb" d="M314.667 391.467c6.4-21.333 19.2-40.533 36.267-55.467 32-26.667 52.267-67.2 52.267-112 0-83.2-69.333-151.467-154.667-147.2C172.8 80 110.933 144 108.8 219.733 107.733 266.667 128 308.267 161.067 336 179.2 350.933 192 370.133 198.4 391.467h116.267z" fill="#ffd15c" stroke="#ffd15c" />
<path id="thing" d="M242.133 393.6h9.6l-42.667-158.933h3.2c5.333 0 10.667-2.133 14.933-6.4 2.133-2.133 4.267-3.2 7.467-3.2 3.2 0 5.333 1.067 7.467 3.2 7.467 8.533 20.267 8.533 27.733 0 2.133-2.133 4.267-3.2 7.467-3.2 2.133 0 5.333 1.067 7.467 3.2 4.267 4.267 8.533 6.4 14.933 6.4h3.2l-41.6 158.933h9.6l43.733-166.4c0-2.133 0-4.267-2.133-5.333-2.133-1.067-4.267 0-5.333 1.067-2.133 2.133-4.267 3.2-6.4 3.2-3.2 0-5.333-1.067-8.533-3.2-4.267-4.267-8.533-6.4-13.867-6.4s-9.6 2.133-13.867 6.4-10.667 4.267-14.933 0c-3.2-4.267-8.533-6.4-13.867-6.4-5.333 0-10.667 2.133-13.867 6.4-2.133 2.133-5.333 3.2-8.533 3.2-2.133 0-5.333-1.067-6.4-3.2-1.067-1.067-3.2-2.133-5.333-1.067-2.133 1.067-3.2 3.2-2.133 5.333l42.666 166.4z" fill="#ccc" />
<g fill="#344a5e"&.........完整代码请登录后点击上方下载按钮下载查看