gsap+svg实现文字拖拽抖动动画效果代码

代码语言:html

所属分类:拖放

代码描述:gsap+svg实现文字拖拽抖动动画效果代码

代码标签: gsap svg 文字 拖拽 抖动 动画

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

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

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

<style>
    @font-face {
  font-family: "GT-Flexa";
  src: url("//repo.bfw.wiki/bfwrepo/font/GT-Flexa-VF-Trial.woff2");
  font-display: block;
  font-style: normal italic;
  font-weight: 100 800;
  font-stretch: 10% 200%;
}
:root {
  --fw: 600;
  --fs: 150;
  --fontSize: 15;
  --baseColor: "red";
}

html {
  box-sizing: border-box;
}

*, *:before, *:after {
  box-sizing: inherit;
}

html, body {
  width: 100%;
  height: 100%;
}

body {
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: #FF7F99;
  font-family: "GT-Flexa";
  font-size: 20px;
  color: white;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  cursor: url("data:image/svg+xml,%3Csvg width='64px' height='64px' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 700 700'%3E%3Cpath d='M419.99,560.0013c83.627,0,151.67-68.041,151.67-151.67v-198.33A46.6565,46.656.........完整代码请登录后点击上方下载按钮下载查看

网友评论0