anime+svg实现学生孩子疯狂加班写作业动画效果代码
代码语言：html
所属分类：动画
代码描述：anime+svg实现学生孩子疯狂加班写作业动画效果代码
代码标签： anime svg 学生 孩子 疯狂 加班 写作业
下面为部分代码预览，完整代码请点击下载或在bfwstudio webide中打开
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<style>
* { box-sizing: border-box;}body { background-color: #1b834f; display: flex; justify-content: center; align-items: center; overflow: hidden;}.wrp { height: 100vh; width: 100%;}.wrp svg { height: 100%; width: 100%;}.wrp svg * { -webkit-transform-origin: center; transform-origin: center; transform-box: fill-box;}.wrp svg .swet,.wrp svg .debre,.wrp svg .flash,.wrp svg #paper1 { opacity: 0;}
</style>
</head>
<body>
<!-- partial:index.partial.html -->
<!-- svg from shutterstock -->
<div class="wrp"><svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 686 548" enable-background="new 0 0 686 548" xml:space="preserve"><g id="bg"><g><path fill-rule="evenodd" clip-rule="evenodd" fill="#0a5f34" d="M368.5,92.5c-85.2,0-138.4,63.8-126.5,146.3 c-31.4,12.7-49.2,43.8-44.5,81.5c-1-0.1-2-0.1-2.9-0.1c-28.7,0-46,23.3-38.6,51.9c7.4,28.7,36.6,51.9,65.3,51.9 c14.1,0,25.4-5.6,32.4-14.7c21.8,15.7,47.7,25.2,73.3,25.2c24.4,0,44.5-8.6,58.3-23c23.5,9.5,48.1,14.7,72.6,14.7 c92.2,0,146.9-74.7,122.2-166.9C555.5,167.2,460.7,92.5,368.5,92.5z" /><path fill-rule="evenodd" clip-rule="evenodd" fill="#05522b" d="M488.4,133c-33.9-23.8-73.3-38.7-112.6-40.4 c-1.8,4.3-3.3,8.8-4.2,13.4c-7.4,35.5,15.3,64.2,50.7,64.2C448.1,170.2,473.6,155,488.4,133z" /><path fill-rule="evenodd" clip-rule="evenodd" fill="#cc1b1b" d="M442.2,34.5c35.5,0,58.2,28.7,50.7,64.2 c-7.4,35.5-42.2,64.2-77.7,64.2c-35.5,0-58.2-28.7-50.7-64.2C372,63.3,406.7,34.5,442.2,34.5z" /><polygon fill-rule="evenodd" clip-rule="evenodd" fill="#0a5f34" points="275.1,239.2 231.6,198.2 226.6,222.8 164.1,157.8 176.1,204.2 72.7,140.7 202.9,238.6 192.8,204.2 244.1,247.9 241.3,218.6 " /><path fill-rule="evenodd" clip-rule="evenodd" fill="#0a5f34" d="M240.5,144.4L240.5,144.4c1.1-1.1,2.8-1.1,3.9,0l2.5,2.5 c1.1,1.1,1.1,2.8,0,3.9l0,0c-1.1,1.1-2.8,1.1-3.9,0l-2.5-2.5C239.4,147.3,239.4,145.5,240.5,144.4z" /><path fill-rule="evenodd" clip-rule="evenodd" fill="#0a5f34" d="M224.8,128.8L224.8,128.8c1.1-1.1,2.8-1.1,3.9,0l7.1,7.1 c1.1,1.1,1.1,2.8,0,3.9l0,0c-1.1,1.1-2.8,1.1-3.9,0l-7.1-7.1C223.7,131.6,223.7,129.8,224.8,128.8z" /><path fill-rule="evenodd" clip-rule="evenodd" fill="#0a5f34" d="M223.3,151.8L223.3,151.8c0.4-1.5,1.9-2.3,3.4-2l7.9,2.1 c1.5,0.4,2.3,1.9,1.9,3.4v0c-0.4,1.5-1.9,2.3-3.4,2l-7.9-2.1C223.8,154.7,223,153.2,223.3,151.8z" /><path fill-rule="evenodd" clip-rule="evenodd" fill="#0a5f34" d="M213.6,149.1L213.6,149.1c0.4-1.5,1.9-2.3,3.4-2l1.3,0.3 c1.5,0.4,2.3,1.9,1.9,3.4v0c-0.4,1.5-1.9,2.3-3.4,1.9l-1.3-0.3C214.1,152.1,213.2,150.6,213.6,149.1z" /><polygon fill-rule="evenodd" clip-rule="evenodd" fill="#0a5f34" points="544.3,223.4 567.6,201.4 570.3,214.5 603.9,179.7 597.4,204.6 653,170.5 583.1,223.1 588.5,204.6 560.9,228 562.4,212.3 " /><ellipse transform="matrix(0.743 -0.6692 0.6692 0.743 42.794 307.6485)" fill-rule="evenodd" clip-rule="evenodd" fill="#ee3333" cx="422" cy="98.1" rx="71.3" ry="57.8" /><path fill-rule="evenodd" clip-rule="evenodd" fill="#FFFDF7" d="M433.3,44.4c29.7,0,48.7,24,42.4,53.7 c-6.2,29.7-35.3,53.7-65,53.7c-29.7,0-48.7-24-42.4-53.7C374.5,68.4,403.6,44.4,433.3,44.4z" /><path fill-rule="evenodd" clip-rule="evenodd" fill="#cc1b1b" d="M430.8,44.4c0.9,0,1.8,0,2.7,0.1c-28.7,1.4-56.2,24.9-62.3,53.6 c-6,28.8,11.7,52.2,39.8,53.6c-0.9,0-1.8,0.1-2.7,0.1c-29.7,0-48.7-24-42.4-53.7C372,68.4,401.1,44.4,430.8,44.4z" /><g><path fill-rule="evenodd" clip-rule="evenodd" fill="#333333" d="M414.6,133.7L414.6,133.7c1.6,0,2.7,1.3,2.3,2.9l-1.4,6.5 c-0.3,1.6-1.9,2.9-3.5,2.9h0c-1.6,0-2.7-1.3-2.3-2.9l1.4-6.5C411.4,135,413,133.7,414.6,133.7z" /><path fill-rule="evenodd" clip-rule="evenodd" fill="#333333" d="M432.1,50L432.1,50c1.6,0,2.7,1.3,2.3,2.9l-1.4,6.5 c-0.3,1.6-1.9,2.9-3.5,2.9h0c-1.6,0-2.7-1.3-2.3-2.9l1.4-6.5C428.9,51.4,430.5,50,432.1,50z" /></g><g><path fill-rule="evenodd" clip-rule="evenodd" fill="#333333" d="M391.6,123.2L391.6,123.2c0.9,1.1,0.7,2.8-0.4,3.8l-6.5,5.4 c-1.1,0.9-2.8,0.8-3.7-0.4v0c-0.9-1.1-0.7-2.8,0.4-3.8l6.5-5.4C389,121.9,390.7,122.1,391.6,123.2z" /><path fill-rule="evenodd" clip-rule="evenodd" fill="#333333" d="M463.1,64.1L463.1,64.1c0.9,1.1,0.7,2.8-0.4,3.8l-6.5,5.4 c-1.1,0.9-2.8,0.8-3.7-0.4v0c-0.9-1.1-0.7-2.8,0.4-3.8l6.5-5.4C460.5,62.8,462.2,63,463.1,64.1z" /></g><g><path fill-rule="evenodd" clip-rule="evenodd" fill="#333333" d="M386.4,98L386.4,98c-0.3,1.6-2,2.9-3.7,2.9h-6.2 c-1.7,0-2.8-1.3-2.4-2.9l0,0c0.3-1.6,2-2.9,3.7-2.9h6.2C385.6,95.1,386.7,96.4,386.4,98z" /><path fill-rule="evenodd" clip-rule="evenodd" fill="#333333" d="M470,98L470,98c-0.3,1.6-2,2.9-3.7,2.9h-6.2 c-1.7,0-2.8-1.3-2.4-2.9v0c0.3-1.6,2-2.9,3.7-2.9h6.2C469.3,95.1,470.4,96.4,470,98z" /></g><g><path fill-rule="evenodd" clip-rule="evenodd" fill="#333333" d="M402.1,72.8L402.1,72.8c-1.4,1.1-3.4,0.9-4.5-0.5l-2.9-3.6 c-1.1-1.4-0.9-3.5,0.5-4.6h0c1.4-1.1,3.4-0.9,4.5,0.5l2.9,3.6C403.7,69.6,403.5,71.7,402.1,72.8z" /><path fill-rule="evenodd" clip-rule="evenodd" fill="#333333" d="M448.9,132L448.9,132c-1.4,1.1-3.4,0.9-4.5-0.5l-2.9-3.6 c-1.1-1.4-0.9-3.5,0.5-4.6l0,0c1.4-1.1,3.4-0.9,4.5,0.5l2.9,3.6C450.5,128.7,450.2,130.8,448.9,132z" /></g><path fill-rule="evenodd" clip-rule="evenodd" fill="#cccccc" d="M432.8,61.9c14.9,0,23,14.2,18,31.6c-5,17.5-21.1,31.6-36.1,31.6 c-13.8,0-21.8-12.1-19-27.7c-1.8,13.4,5.3,23.5,17.3,23.5c13.5,0,28-12.8,32.5-28.5c4.5-15.7-2.8-28.5-16.3-28.5 c-6.4,0-13,2.9-18.7,7.5C417.3,65.6,425.2,61.9,432.8,61.9z" /><path fill-rule="evenodd" clip-rule="evenodd" fill="#0a5f34" d="M355.2,53.6L355.2,53.6c0,1.5-1.2,2.8-2.8,2.8H349 c-1.5,0-2.8-1.2-2.8-2.8v0c0-1.5,1.2-2.8,2.8-2.8h3.5C354,50.8,355.2,52,355.2,53.6z" /><path fill-rule="evenodd" clip-rule="evenodd" fill="#0a5f34" d="M377.4,53.6L377.4,53.6c0,1.5-1.2,2.8-2.8,2.8h-10.1 c-1.5,0-2.8-1.2-2.8-2.8v0c0-1.5,1.2-2.8,2.8-2.8h10.1C376.2,50.8,377.4,52,377.4,53.6z" /><path fill-rule="evenodd" clip-rule="evenodd" fill="#0a5f34" d="M365.4,71.8L365.4,71.8c0,1.5-1.2,2.8-2.8,2.8h-22.2 c-1.5,0-2.8-1.2-2.8-2.8v0c0-1.5,1.2-2.8,2.8-2.8h22.2C364.2,69,365.4,70.3,365.4,71.8z" /><path fill-rule="evenodd" clip-rule="evenodd" fill="#0a5f34" d="M335.2,71.8L335.2,71.8c0,1.5-1.2,2.8-2.8,2.8h-2.3 c-1.5,0-2.8-1.2-2.8-2.8v0c0-1.5,1.2-2.8,2.8-2.8h2.3C334,69,335.2,70.3,335.2,71.8z" /><path fill-rule="evenodd" clip-rule="evenodd" fill="#0a5f34" d="M319.5,71.8L319.5,71.8c0,1.5-1.2,2.8-2.8,2.8h-2.3 c-1.5,0-2.8-1.2-2.8-2.8v0c0-1.5,1.2-2.8,2.8-2.8h2.3C318.2,69,319.5,70.3,319.5,71.8z" /><path fill-rule="evenodd" clip-rule="evenodd" fill="#0a5f34" d="M298.9,71.8L298.9,71.8c0,1.5-1.2,2.8-2.8,2.8h-2.3 c-1.5,0-2.8-1.2-2.8-2.8v0c0-1.5,1.2-2.8,2.8-2.8h2.3C297.7,69,298.9,70.3,298.9,71.8z" /></g></g><g id="leftHand"><path fill-rule="evenodd" clip-rule="evenodd" fill="#7A98B0" d="M448.7,317c-8.5,6.7-8.1,20.2,0.8,30.2c8.9,9.9,23,12.6,31.5,5.8 c0.3-0.3,70.1-70.3,83.5-56.4c6.9,10.7-12.6,33.8-12.7,34c-5.9,9-2,22.8,8.8,30.7c10.8,7.9,24.3,7,30.2-2.1 c0.2-0.3,65.5-98.5,24.5-125.9C580.9,210.4,449.1,316.7,448.7,317z" /><path fill-rule="evenodd" clip-rule="evenodd" fill="#5D7A93" d="M571.4,366.1c7.8,1.6,15.3-0.8,19.3-7c0.1-0.1,7.8-11.7,16.2-27.9 c-6.4-3.5-14.1-5.6-22-5.6c-17.8,0-30,10.5-27.1,23.5C559.2,355.9,564.3,361.9,571.4,366.1z" /><path fill-rule="evenodd" clip-rule="evenodd" fill="#7A98B0" d="M572.9,324.7c17.8,0,34.6,10.5,37.4,23.5 c2.8,13-9.3,23.5-27.1,23.5c-17.8,0-34.6-10.5-37.4-23.5C543,335.3,555.1,324.7,572.9,324.7z" /><path fill-rule="evenodd" clip-rule="evenodd" fill="#5D7A93" d="M570,333c13.7,0,26.6,8.1,28.8,18.1c2.2,10-7.1,18.1-20.8,18.1 c-13.7,0-26.6-8.1-28.8-18.1C547,341.1,556.3,333,570,333z" /><path fill-rule="evenodd" clip-rule="evenodd" fill="#93ADC9" d="M576.7,270.6c9.5-17.7,22.7-28.5,29.4-24.2c6.8,4.4,4.5,22.3-5,40 c-9.5,17.7-22.7,28.5-29.4,24.2C565,306.2,567.2,288.3,576.7,270.6z" /><path fill-rule="evenodd" clip-rule="evenodd" fill="#FF966C" d="M556.8,347.2c2.5-7.9,11.7-10.9,20.5-6.7c8.8,4.2,14,14.1,11.5,22 l-13.6,42.9h-28.7c-3.4-4.6-4.9-10.3-3.3-15.3L556.8,347.2z" /><path fill-rule="evenodd" clip-rule="evenodd" fill="#FDA988" d="M556.8,347.2c2.1-6.6,8.7-9.8,16-8.2L561,376.1h-13.4L556.8,347.2 z" /><path fill-rule="evenodd" clip-rule="evenodd" fill="#E6845E" d="M543.1,398.5c-0.7-2.8-0.7-5.7,0.1-8.3l10.1-31.9 c16.5,5.2,26.7,18.3,24.1,32.7c-0.5,2.6-1.3,5.1-2.6,7.5H543.1z" /></g><g id="Warstwa_17"><path fill-rule="evenodd" clip-rule="evenodd" fill="#7A98B0" d="M408.2,311.9c54,0,113.8,37.1,133.5,82.9 c1.6,3.6,2.8,7.2,3.8,10.6H351.4c-2-3.5-3.8-7-5.4-10.6C326.4,349,354.2,311.9,408.2,311.9z" /><path fill-rule="evenodd" clip-rule="evenodd" fill="#A7C0DC" d="M408.2,311.9c9,0,18.1,1,27.2,2.9c0.8,4.7,0.7,9.8-0.4,15.2 c-4.3,22.3-23.3,40.4-42.5,40.4c-19.2,0-31.3-18.1-27.1-40.4c0.6-3.2,1.5-6.4,2.7-9.4C378.9,315,392.4,311.9,408.2,311.9z" /><path fill-rule="evenodd" clip-rule="evenodd" fill="#6C8EA2" d="M411.6,311.9c53.1,1.5,110.8,38,130.1,82.9 c1.6,3.6,2.8,7.2,3.8,10.6h-149c-2-3.9-3.8-7.8-5.4-11.8C377.5,358.2,386.7,327.4,411.6,311.9z" /><path fill-rule="evenodd" clip-rule="evenodd" fill="#93ADC9" d="M411.6,311.9c7.9,0.2,15.8,1.2,23.7,2.9c0.7,4.7,0.7,9.8-0.4,15.2 c-4.3,22.3-23.3,40.4-42.5.........完整代码请登录后点击上方下载按钮下载查看
热门代码搜索
其他语言代码库
Html代码库
Python代码库
Java代码库
Php代码库
Phpcli代码库
Golang代码库
C#代码库
Nodejs代码库
C代码库
C++代码库
Sql代码库
R代码库
Rust代码库
Ruby代码库
Dart代码库
Vb代码库
D代码库
F#代码库
Typescript代码库
Coffeescript代码库
Julia代码库
Kotlin代码库
Perl代码库
Groovy代码库
Lua代码库
Vala代码库
Ocaml代码库
Assembly代码库
Objectc代码库
Scala代码库
Erlang代码库
Pascal代码库
Swift代码库
Fortran代码库
Bash代码库
Clojure代码库
Ada代码库
Elixir代码库
Cobol代码库
Haskell代码库
Nim代码库
Racket代码库
Lisp代码库
网友评论0