js实现一个星级评分动画效果代码-html代码-BFW代码库

js实现一个星级评分动画效果代码

代码语言：html

代码描述：js实现一个星级评分动画效果代码

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

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">






    <style>
        @-webkit-keyframes star-animation {
          0% {
            fill: #d0d8e0;
            stroke: #d0d8e0;
            stroke-width: 2;
            transform: scale(1) rotate(-72deg);
            opacity: 1;
          }
          50% {
            transform: scale(1.25);
          }
          65% {
            transform: scale(0.5);
          }
          80% {
            stroke: gold;
            transform: scale(1.1) rotate(-3deg);
          }
          100% {
            fill: gold;
            stroke: gold;
            transform: scale(1) rotate(0deg);
          }
        }
        @keyframes star-animation {
          0% {
            fill: #d0d8e0;
            stroke: #d0d8e0;
            stroke-width: 2;
            transform: scale(1) rotate(-72deg);
            opacity: 1;
          }
          50% {
            transform: scale(1.25);
          }
          65% {
            transform: scale(0.5);
          }
          80% {
            stroke: gold;
            transform: scale(1.1) rotate(-3deg);
          }
          100% {
            fill: gold;
            stroke: gold;
            transform: scale(1) rotate(0deg);
          }
        }
        @-webkit-keyframes circle-animation {
          0% {
            transform: scale(0);
            opacity: 0;
          }
          30% {
            transform: scale(1.25);
            opacity: 0.3;
          }
          60% {
            transform: scale(1.75);
            opacity: 0.3;
          }
          100% {
            transform: scale(3);
            opacity: 0;
          }
        }
        @keyframes circle-animation {
          0% {
            transform: scale(0);
      .........完整代码请登录后点击上方下载按钮下载查看