bmy/ClassContent
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

first commit

Browse Source
This commit is contained in:
编码猿
2024-09-27 02:06:13 +08:00
commit 852d94fbb9
36760 changed files with 3274413 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

12
历届学生/front-end-team-11/项目开发/学生项目/贡婉宝/水管鸟/css/clear.css Normal file
View File

@@ -0,0 +1,12 @@
body,ul,p,h1,h2,h3,h4,h5,h6 {
margin: 0;
padding: 0;
}
html {
/* font-size: 50px; */
}
body {
font-size: 0;
}

152
历届学生/front-end-team-11/项目开发/学生项目/贡婉宝/水管鸟/css/index.css Normal file
View File

@@ -0,0 +1,152 @@
body {
background-image: url(../img/back.png);
background-size: contain;
height: 100vh;
position: relative;
text-align: center;
user-select: none;
}
body .pipe{
width: 55px;
position: fixed;
/* transition: all 1s; */
}
.diban {
position: fixed;
z-index: 9999999;
}
.diban img {
position: absolute;
width: 100%;
height: 100%;
}
/* 鸟 */
.bird {
width: 34px;
height: 24px;
background-image: url(../img/hn1.png);
position: fixed;
transition: all linear 0.15s;
}
@keyframes instigateong {
0% {
background-image: url(../img/hn1.png);
}
50% {
background-image: url(../img/hn2.png);
}
100% {
background-image: url(../img/hn3.png);
}
}
@keyframes instigatetwo {
0% {
background-image: url(../img/hn_blue_1.png);
}
50% {
background-image: url(../img/hn_blue_2.png);
}
100% {
background-image: url(../img/hn_blue_1.png);
}
}
@keyframes instigatethress {
0% {
background-image: url(../img/hn_red_1.png);
}
50% {
background-image: url(../img/hn_red_2.png);
}
100% {
background-image: url(../img/hn_red_3.png);
}
}
@keyframes birdShake {
0% {
transform: translateY(0px);
}
50% {
transform: translateY(10px);
}
100% {
transform: translateY(0px);
}
}
.bird_title {
position: absolute;
left: 50%;
top: 40%;
transform: translate(-50%, -40%);
display: flex;
flex-direction: column;
align-items: center;
z-index: 999;
}
.bird_list {
display: flex;
align-items: center;
justify-content: space-between;
}
.bird_list img {
cursor: pointer;
}
.up{
transform: rotate(-38deg);
}
.down{
transform: rotate(90deg);
}
.start{
font-size: 20px;
margin: 10px 0;
cursor: pointer;
}
.out{
position: fixed;
left: 30px;
top: 30px;
}
.Goon,.Hungup{
position: fixed;
left: 50%;
top: 50%;
transform: translate(-50%,-50%)
}
.tite,.Hungup1{
position: fixed;
left: 50%;
top: 36%;
transform: translate(-55%,-42%);
}
.Integral{
position: fixed;
top: 30px;
left: 50%;
transform: translateX(-50%);
}
.pipe{
transition: all 0.2s;
}

BIN
历届学生/front-end-team-11/项目开发/学生项目/贡婉宝/水管鸟/img/0.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.7 KiB

BIN
历届学生/front-end-team-11/项目开发/学生项目/贡婉宝/水管鸟/img/1.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.7 KiB

BIN
历届学生/front-end-team-11/项目开发/学生项目/贡婉宝/水管鸟/img/2.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.7 KiB

BIN
历届学生/front-end-team-11/项目开发/学生项目/贡婉宝/水管鸟/img/3.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.7 KiB

BIN
历届学生/front-end-team-11/项目开发/学生项目/贡婉宝/水管鸟/img/4.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.7 KiB

BIN
历届学生/front-end-team-11/项目开发/学生项目/贡婉宝/水管鸟/img/5.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.7 KiB

BIN
历届学生/front-end-team-11/项目开发/学生项目/贡婉宝/水管鸟/img/6.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.7 KiB

BIN
历届学生/front-end-team-11/项目开发/学生项目/贡婉宝/水管鸟/img/7.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.7 KiB

BIN
历届学生/front-end-team-11/项目开发/学生项目/贡婉宝/水管鸟/img/8.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.7 KiB

BIN
历届学生/front-end-team-11/项目开发/学生项目/贡婉宝/水管鸟/img/9.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.7 KiB

BIN
历届学生/front-end-team-11/项目开发/学生项目/贡婉宝/水管鸟/img/back.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 7.9 KiB

BIN
历届学生/front-end-team-11/项目开发/学生项目/贡婉宝/水管鸟/img/back_dark.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 3.3 KiB

BIN
历届学生/front-end-team-11/项目开发/学生项目/贡婉宝/水管鸟/img/diban.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 2.0 KiB

BIN
历届学生/front-end-team-11/项目开发/学生项目/贡婉宝/水管鸟/img/gameover.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 2.8 KiB

BIN
历届学生/front-end-team-11/项目开发/学生项目/贡婉宝/水管鸟/img/hn1.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.9 KiB

BIN
历届学生/front-end-team-11/项目开发/学生项目/贡婉宝/水管鸟/img/hn2.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.9 KiB

BIN
历届学生/front-end-team-11/项目开发/学生项目/贡婉宝/水管鸟/img/hn3.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.9 KiB

BIN
历届学生/front-end-team-11/项目开发/学生项目/贡婉宝/水管鸟/img/hn_blue_1.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.7 KiB

BIN
历届学生/front-end-team-11/项目开发/学生项目/贡婉宝/水管鸟/img/hn_blue_2.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.8 KiB

BIN
历届学生/front-end-team-11/项目开发/学生项目/贡婉宝/水管鸟/img/hn_blue_3.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.8 KiB

BIN
历届学生/front-end-team-11/项目开发/学生项目/贡婉宝/水管鸟/img/hn_red_1.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.7 KiB

BIN
历届学生/front-end-team-11/项目开发/学生项目/贡婉宝/水管鸟/img/hn_red_2.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.7 KiB

BIN
历届学生/front-end-team-11/项目开发/学生项目/贡婉宝/水管鸟/img/hn_red_3.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.7 KiB

BIN
历届学生/front-end-team-11/项目开发/学生项目/贡婉宝/水管鸟/img/pause.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.7 KiB

BIN
历届学生/front-end-team-11/项目开发/学生项目/贡婉宝/水管鸟/img/sg_b.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 3.9 KiB

BIN
历届学生/front-end-team-11/项目开发/学生项目/贡婉宝/水管鸟/img/sg_t.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 3.9 KiB

BIN
历届学生/front-end-team-11/项目开发/学生项目/贡婉宝/水管鸟/img/start.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 2.1 KiB

BIN
历届学生/front-end-team-11/项目开发/学生项目/贡婉宝/水管鸟/img/title.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 2.2 KiB

50
历届学生/front-end-team-11/项目开发/学生项目/贡婉宝/水管鸟/index.html Normal file
View File

@@ -0,0 +1,50 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<link rel="stylesheet" href="./css/clear.css">
<link rel="stylesheet" href="./css/index.css">
<style>
</style>
</head>
<body>
<div class="Integral" style="display: none;">
<img src="./img/0.png">
</div>
<img src=".//img/pause.png" class="out" style="display:none;">
<div class="diban" >
<img src="./img/diban.png" class="ong_img">
<img src="./img/diban.png" class="two_img">
</div>
<div class="bird_title">
<img class="bird_logo" src="./img/title.png" alt="">
<div class="start">普通模式</div>
<div style="font-size: 20px;" class="difficulty">困难模式</div>
<div class="bird_list">
<img src="./img/hn1.png" alt="">
<img src="./img/hn_blue_1.png" alt="">
<img src="./img/hn_red_1.png" alt="">
</div>
</div>
<img style=" display: none; z-index: 9999;" src="./img/start.png" class="Goon">
<img src="./img/title.png" class="tite" style=" display: none;">
<!-- birdShake 0.4s linear infinite reverse; -->
<div class="bird"
style="left:100px;width: 34px;height: 24px; animation: instigateong 0.4s linear infinite reverse,birdShake 0.4s linear infinite reverse;">
</div>
<img src="./img/gameover.png" class="Hungup1" style="display:none;z-index: 99999;">
<img src="./img/start.png" class="Hungup" style="display:none;z-index: 99999;">
</body>
<script src="./js/clas.js"></script>
<script src="./js/index.js"></script>
</html>

33
历届学生/front-end-team-11/项目开发/学生项目/贡婉宝/水管鸟/js/clas.js Normal file
View File

@@ -0,0 +1,33 @@
class incommon{
$(name){
return document.querySelector(name);
}
_(name){
return document.querySelectorAll(name);
}
customMethods(){
Element.prototype.add=function(name){
this.classList.add(name)
}
Element.prototype.remove=function(name){
this.classList.remove(name)
}
Element.prototype.none = function() {
this.style.display = "none"
}
Element.prototype.show = function() {
this.style.display = "block"
}
}
getRandom(min, max) {
const floatRandom = Math.random()
const difference = max - min
const random = Math.round(difference * floatRandom)
const randomWithinRange = random + min
return randomWithinRange
}
}
let { $, _ ,customMethods,getRandom} = new incommon()
customMethods()

280
历届学生/front-end-team-11/项目开发/学生项目/贡婉宝/水管鸟/js/index.js Normal file
View File

@@ -0,0 +1,280 @@
class HoseBirds {
innerWidth = window.innerWidth;
innerHeight = window.innerHeight;
//游戏状态
gameStatus = false;
//地板速度
dibanMotionSpeed = 1;
//向上
Moveup = 50;
//向下
Movedown = 2;
//鸟皮肤
skinBirds = "instigateong";
//管道中间间隙
interval = 150;
//管道的间隙
space = 300;
//管道的数量
index = 0;
//水管移动
PipeSpeed = 10
indx = 0;
IntervalList = []
constructor() {
this.scroll();
this.SkinResurfacing();
this.Begin()
// this.pipelineimg()
this.Timeout()
$(".diban").style = `top:${(parseInt(this.innerHeight) - 112)}px;
width:${this.innerWidth}px;
height: 112px;
left:0px`
console.log((parseInt( this.innerWidth)%10))
}
scroll() {
$(".ong_img").style = `left:0px`;
$(".two_img").style.left = `${this.innerWidth}px`;
// console.log(this.innerWidth)
setInterval(() => {
// $(".ong_img").style.left = `px`;
if (parseInt($(".ong_img").style.left) <= -this.innerWidth) {
$(".ong_img").style.left = `${this.innerWidth}px`
} else {
$(".ong_img").style.left = `${parseInt($(".ong_img").style.left) - this.dibanMotionSpeed}px`
}
if (parseInt($(".two_img").style.left) <= -this.innerWidth) {
$(".two_img").style.left = `${this.innerWidth}px`
} else {
$(".two_img").style.left = `${parseInt($(".two_img").style.left) - this.dibanMotionSpeed}px`
}
}, 1)
}
//换主题
SkinResurfacing() {
// console.log((this.innerHeight - 112) / 2 - 12)
$(".bird").style.top = `${(this.innerHeight - 112) / 2 - 12}px`
_(".bird_title .bird_list img").forEach((v, i) => {
v.onclick = () => {
switch (i) {
case 0:
this.skinBirds = "instigateong"
$(".bird").style.animationName = "instigateong,birdShake"
break;
case 1:
this.skinBirds = "instigatetwo"
$(".bird").style.animationName = "instigatetwo,birdShake"
break;
case 2:
this.skinBirds = "instigatethress"
$(".bird").style.animationName = "instigatethress,birdShake"
break;
default:
break;
}
}
})
}
//开始
Begin() {
let clickTime;
//点击开始
$(".bird_title .start").onclick = (e) => {
$(".out").show();
$(".Integral").show();
this.gameStatus = true
$(".bird_title").none()
$(".bird").style.animationName = this.skinBirds;
//小鸟下降
this.IntervalList[1] = setInterval(() => {
// console.log("03b"+downclickTime)
if (this.gameStatus == true) {
let downclickTime = new Date().getTime();
// console.log(parseInt(clickTime)-parseInt(downclickTime))
if (clickTime - downclickTime < -300) {
$(".bird").remove("up")
$(".bird").add("down")
}
let Birdsy = parseInt($(".bird").style.top) + this.Movedown;
$(".bird").style.top = `${Birdsy}px`
}
}, 15)
//小鸟上升
$("body").onclick = () => {
if (this.gameStatus) {
clickTime = new Date().getTime();
// console.log("pp"+ clickTime)
//获取当前小鸟top值
let Birdsy = parseInt($(".bird").style.top);
$(".bird").style.top = `${Birdsy - this.Moveup}px`
$(".bird").add("up");
$(".bird").remove("down")
}
}
//生成管道计时器
this.IntervalList[0] = setInterval(() => {
this.pipelineimg()
}, 1000)
}
}
pipelineimg() {
//两个管道的高度
let qq = parseInt(this.innerHeight - 112 - this.interval);
//上管道的高度
let Toptube = getRandom(60, qq - 60);
let Downtube = qq - Toptube;
// console.log(qq, Toptube, Downtube)
//创建管道图片标签
let create = (t) => {
let img = document.createElement("img");
img.src = `./img/sg_${t}.png`
img.typ = t;
img.className = "pipe"
img.style = `
top:${t == "t" ? 0 : Toptube + this.interval}px;
left:${this.innerWidth + 55 + (this.space * this.index)}px;
height:${t == "t" ? Toptube : Downtube}px;
width: 55px;
`
return img
}
let img1 = create("b");
let img2 = create("t");
$("body").appendChild(img1)
$("body").appendChild(img2)
this.PipeMove([img1, img2])
this.index += 1;
}
//暂停
Timeout() {
$(".out").onclick = (e) => {
this.gameStatus = false;
e?.stopPropagation();
this.IntervalList.forEach((v) => {
clearInterval(v)
})
_(".pipe").forEach((v) => {
clearInterval(v.idd)
})
$(".bird_logo").show();
$(".Goon").show();
$(".tite").show();
}
$(".Goon").onclick = (e) => {
this.gameStatus = true;
e?.stopPropagation();
$(".start").onclick()
this.PipeMove(_(".pipe"))
$(".Goon").none();
$(".tite").none();
}
$(".Hungup").onclick = () => {
location.reload()
}
$(".difficulty").onclick = () => {
this.difficulty()
$(".start").onclick()
}
}
difficulty() {
this.Moveup = 50;
//向下
this.Movedown = 4;
//鸟皮肤
this.skinBirds = "instigateong";
//管道中间间隙
this.interval = 100;
//管道的间隙
this.space = 250;
//管道的数量
this.index = 0;
//水管移动
this.PipeSpeed = 10
}
//水管移动方法
PipeMove(a) {
a.forEach(img => {
//计时器
img.idd = setInterval(() => {
if (this.gameStatus == true) {
img.style.left = `${parseInt(img.style.left) - this.PipeSpeed}px`
//达到条件删除水管
if (parseInt(img.style.left) <= -55) {
$("body").removeChild(img);
clearInterval(img.idd)
} else {
this.Collisiondetection($(".bird"), img)
this.Collisiondetection($(".diban"), $(".bird"));
// this.collision($(".diban"), $(".bird"))
}
}
}, 100)
})
}
//碰撞检测
Collisiondetection(one, two) {
if (parseInt(one.style.left) < parseInt(two.style.left) + parseInt(two.style.width) &&
parseInt(one.style.left) + parseInt(one.style.width) > parseInt(two.style.left) &&
parseInt(one.style.top) < parseInt(two.style.top) + parseInt(two.style.height) &&
parseInt(one.style.height) + parseInt(one.style.top) > parseInt(two.style.top)
) {
this.conss()
} else {
if (two.typ == "t") {
// console.log(this.innerWidth)
if ((parseInt(two.style.left) + parseInt(two.offsetWidth)) == (100+(parseInt( this.innerWidth)%10))) {
this.indx += 1;
if (this.indx == 10) {
$("body").style = `background-image: url(./img/back_dark.png);`
}
let indx1 = this.indx.toString().split("");
$(".Integral").innerHTML = ""
indx1.forEach(v => {
$(".Integral").innerHTML += `<img src="./img/${v}.png">`
})
}
}
}
}
conss() {
$(".Hungup1").show();
$(".Hungup").show();
this.gameStatus = false;
setTimeout(() => {
$(".bird").remove("up");
$(".bird").add("down");
$(".bird").style.top = `${(parseInt(this.innerHeight) - 136)}px`
}, 300)
}
}
new HoseBirds();