kinet实现圆点跟随鼠标弹性移动动画效果代码

代码语言:html

所属分类:其他

代码描述:kinet实现圆点跟随鼠标弹性移动动画效果代码

代码标签: kinet 圆点 跟随 鼠标 弹性 移动 动画

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

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">

    <link href="https://fonts.googleapis.com/css?family=Source+Code+Pro" rel="stylesheet">





    <style>
        #cur {
          position: fixed;
          background: teal;
          border-radius: 50%;
          left: 50%;
          top: 50%;
          width: 200px;
          height: 200px;
          margin: -100px 0 0 -100px;
          pointer-events: none;
          animation: kf-cur 1.8s ease infinite;
        }
        
        @keyframes kf-cur {
          0% {
            background: teal;
          }
          50% {
            background: orange;
          }
          100% {
            background: teal;
          }
        }
    </style>




</head>

<body translate="no">
    <div id="cur"></div>
    <script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/kinet..........完整代码请登录后点击上方下载按钮下载查看

网友评论0