马面人跟随鼠标转移视线摇头特效-html代码-BFW代码库

代码语言：html

代码描述：马面人跟随鼠标转移视线摇头特效

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


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

<style>
html, body {
  height: 100%;
}

body {
  display: -webkit-box;
  display: flex;
  -webkit-box-align: center;
          align-items: center;
  -webkit-box-pack: center;
          justify-content: center;
}

svg {
  width: 100%;
  height: 100vh;
  visibility: hidden;
}
</style>

</head>
<body translate="no">
<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 800 600" xml:space="preserve">
<defs>
<clipPath id="eyeLClip">

<circle cx="328.75" cy="270" r="17" />
</clipPath>
<clipPath id="eyeRClip">
<circle cx="463.25" cy="266.5" r="17" />

</clipPath>
<clipPath id="mouthClip">
<path d="M353.624,487.645c0.068,2.867,1.001,5.645,2.538,8.066c5.041,7.938,20.645,28.989,44.834,28.983
               c18.702-0.005,31.546-12.487,38.408-21.385c2.95-3.825,5.153-8.18,6.389-12.85c1.945-7.349,0.228-9.192-0.926-9.644
               c-0.436-0.171-0.932-0.04-1.259,0.296c-2.953,3.031-23.74,20.943-42.484,20.943c-20.474,0-41.068-22.645-41.068-22.645
               S353.429,479.401,353.624,487.645z" />
</clipPath>
<clipPath id="svgClip">
<rect fill="none" width="800" height="600" />
</clipPath>
</defs>
<g clip-path="url(#svgClip)">
<g id="bodyGroup">
<rect x="292.824" y="444.002" width="219.963" height="69.404" />
<path fill="#7D4E30" stroke="#000000" stroke-width="2" stroke-miterlimit="10" d="M148.5,600.5
                        c0,0,11.213-69.518,102.143-107.088c22.822-9.429,47.038-15.017,71.631-17.236c25.178-2.272,48.448-3.387,69.372-3.756
                        c38.552-0.679,69.141,1.179,89.026,3.014c35.455,3.273,69.232,17.177,96.141,40.493c21.455,18.59,41.742,45.682,50.686,84.571
                        H148.5z" />
<path fill="#767676" stroke="#000000" stroke-width="2" stroke-miterlimit="10" d="M504.169,467.566
                        c-0.314-5.093-5.596-48.739-94.451-53.919v-46.049h2.371c18.131,8.228,74.265,34.691,88.26,53.06c0,0,15.414,11.959,27.995,46.908
                        " />
<path fill="#767676" stroke="#000000" stroke-width="2" stroke-miterlimit="10" d="M298.346,467.566
                        c0.314-5.093,5.596-48.739,94.451-53.919v-46.049h-2.371c-18.131,8.228-74.265,34.691-88.26,53.06
                        c0,0-15.414,11.959-27.995,46.908" />
<polyline id="neck" fill="#7D4E30" stroke="#000000" stroke-width="2" stroke-miterlimit="10" points="300.373,504.69 
                        300.373,497.708 302,300 494,300 502.95,497.708 503.464,508.775          " />
<g>
<path fill="#5273C4" stroke="#000000" stroke-width="2" stroke-miterlimit="10" d="M401.253,570.097
                                c-74.707,1.005-103.056-76.415-103.056-76.415v226.542h103.056h103.056V493.682C504.309,493.682,475.96,571.103,401.253,570.097z
                                " />
<path fill="#5273C4" stroke="#000000" stroke-width="2" stroke-miterlimit="10" d="M401.11,585.551
                                c-64.596,0.792-101.963-47.06-101.963-47.06v181.679h102.399h0.304h102.399V538.492
                                C504.249,538.492,465.706,586.343,401.11,585.551z" />
</g>
<g>
<path fill="#767676" stroke="#000000" stroke-width="2" stroke-miterlimit="10" d="M296.824,467.241
                                c0,0-72.605,18.304-103.111,53.691s-45.759,51.25-56.131,139.108c0,0-6.711,81.101-2.441,101.258h181.817
                                c0,0-5.491-203.759-28.066-240.366L296.824,467.241z" />
<path fill="#767676" stroke="#000000" stroke-width="2" stroke-linecap="square" stroke-miterlimit="10" d="M274.17,467.566
                                c-10.233,28.425-18.591,72.059-15.257,136.836l48.659,23.053l-39.873,31.189l11.489,54.242h44.183l-12.996-140.974
                                l-12.048-78.345l0.001-25.516c0,0,0-0.168,0.02-0.484c0,0,0.177-2.721,0.575-3.904" />
</g>
<g>
<path fill="#767676" stroke="#000000" stroke-width="2" stroke-miterlimit="10" d="M505.692,467.241
                                c0,0,72.605,18.304,103.111,53.691s45.759,51.25,56.131,139.108c0,0,6.711,81.101,2.44,101.258H485.558
                                c0,0,5.491-203.759,28.066-240.366L505.692,467.241z" />
<path fill="#767676" stroke="#000000" stroke-width="2" stroke-linecap="square" stroke-miterlimit="10" d="M524.719,458.267
                                l3.626,9.299c10.233,28.425,18.591,72.059,15.257,136.836.........完整代码请登录后点击上方下载按钮下载查看