js实现一个树丛中找动物小游戏效果代码
代码语言:html
所属分类:游戏
代码描述:js实现一个树丛中找动物小游戏效果代码
下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开
<!DOCTYPE html> <html lang="en" > <head> <meta charset="UTF-8"> <style> html { background:MediumSeaGreen; background-size: 20% auto; overflow: hidden; font-family: sans-serif; font-size: 36px; line-height: 100%; text-align: center; } p { margin-top: 0; } p .bird { cursor: auto; } p span { font-weight: 900; } .grass { width: 1vw; height: 100%; position: absolute; bottom: 0; background-color: green; background: linear-gradient(to bottom, forestgreen 75%, olive); background-size: 200% auto; box-shadow: 0 0 10px black; border-radius: 100% 100% 0 0; transform-origin: center bottom; pointer-events: none; animation: sway 5s linear infinite; } @keyframes sway { 25% { transform: skewX(3deg); } 75% { transform: skewX(-3deg); } } .bird { position: absolute; font-size: 36px; line-height: 100%; cursor: pointer; user-select: none; } .bird:hover { z-index: 2 !important; } </style> </head> <body > <!-- 🦉🦚🦜🦢🦩🐦🐧🦅🦆 --> <p>Can you find <span>9</span> birds?<br></p> <script> var grass = 100; var colors = ["green", "darkgreen", "olive"]; var birds = ["🦉", "🦚", "🦜", "🦢", "🦩", "🐦", "🐧", "🦅", "🦆"]; var win = [ "What a keen eye you have!", "Maybe you should go birding?", "Clapping. Lots of clapping!", "You have won the great prize of our kudos!" ]; function addGrass() { for (var i = 0; i < grass; i++) { var t = .........完整代码请登录后点击上方下载按钮下载查看
网友评论0