Skip to content

Commit 15907de

Browse files
committed
add files
1 parent 6de40e6 commit 15907de

File tree

3,302 files changed

+46133
-0
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

3,302 files changed

+46133
-0
lines changed

.gitignore

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,3 @@
1+
*.project
2+
*.project
3+
.project

2048游戏/css/style.css

Lines changed: 176 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,176 @@
1+
@charset "UTF-8";
2+
* {
3+
padding: 0;
4+
margin: 0;
5+
}
6+
html {
7+
font-size: 22px;
8+
}
9+
.my2048 {
10+
width: 100%;
11+
height: 100%;
12+
position: absolute;
13+
top: 0;
14+
left: 0;
15+
z-index: 10;
16+
}
17+
header {
18+
display: block;
19+
margin: 0 auto;
20+
width: 100%;
21+
text-align: center;
22+
}
23+
header h1 {
24+
font-family: Arial;
25+
font-size: 40px;
26+
font-weight: bold;
27+
margin: 0 auto;
28+
}
29+
header #newgamebutton {
30+
display: block;
31+
margin: 13px auto;
32+
width: 100px;
33+
padding: 10px 10px;
34+
background-color: #8f7a66;
35+
font-family: Arial;
36+
font-size: 18px;
37+
color: white;
38+
border-radius: 10px;
39+
text-decoration: none;
40+
}
41+
header #newgamebutton:hover {
42+
background-color: #9f8b77;
43+
}
44+
header p {
45+
font-family: Arial;
46+
font-size: 25px;
47+
margin: 13px auto;
48+
}
49+
#grid-container {
50+
width: 500px;
51+
height: 500px;
52+
margin: 10px auto;
53+
background-color: #bbada0;
54+
border-radius: 10px;
55+
position: relative;
56+
}
57+
.grid-cell {
58+
width: 100px;
59+
height: 100px;
60+
border-radius: 6px;
61+
background-color: #ccc0b3;
62+
position: absolute;
63+
z-index: 9;
64+
}
65+
.number-cell {
66+
border-radius: 6px;
67+
font-family: Arial;
68+
font-weight: bold;
69+
font-size: 40px;
70+
line-height: 100px;
71+
text-align: center;
72+
position: absolute;
73+
z-index: 10;
74+
}
75+
footer {
76+
text-align: center;
77+
font-family: '微软雅黑';
78+
font-size: 16px;
79+
padding: 10px;
80+
margin: 10px auto
81+
}
82+
#my2048Alert {
83+
width: 100%;
84+
height: 100%;
85+
position: absolute;
86+
top: 0;
87+
left: 0;
88+
z-index: 0;
89+
opacity: 0;
90+
font-family: "微软雅黑";
91+
-webkit-transition: all 0.5s;
92+
-o-transition: all 0.5s;
93+
transition: all 0.5s;
94+
}
95+
#my2048Alert .mack {
96+
width: 100%;
97+
height: 100%;
98+
position: absolute;
99+
top: 0;
100+
left: 0;
101+
background: rgba(0, 0, 0, .4);
102+
}
103+
#my2048Alert .myAt {
104+
width: 13rem;
105+
height: 11rem;
106+
position: absolute;
107+
top: 50%;
108+
left: 50%;
109+
margin-top: -5.5rem;
110+
margin-left: -6.5rem;
111+
border-radius: 5px;
112+
background: #fff;
113+
-webkit-transition: all 0.5s;
114+
-o-transition: all 0.5s;
115+
transition: all 0.5s;
116+
}
117+
#my2048Alert .myAt .myAt-pic {
118+
width: 7rem;
119+
height: 7rem;
120+
background: url(../img/head.jpg) no-repeat;
121+
-webkit-background-size: cover;
122+
background-size: cover;
123+
background-position: -15px;
124+
border-radius: 50%;
125+
position: absolute;
126+
top: -22%;
127+
left: 50%;
128+
margin-left: -3.5rem;
129+
border: 3px solid #f87758;
130+
}
131+
#my2048Alert .myAt .myAt-text {
132+
width: 100%;
133+
font-size: 0.8rem;
134+
line-height: 1.4rem;
135+
text-align: center;
136+
position: absolute;
137+
left: 0;
138+
top: 45%;
139+
}
140+
#my2048Alert .myAt .myAt-text .myAt-text-title, #my2048Alert .myAt .myAt-text .myAt-text-subtitle {
141+
color: #999;
142+
}
143+
#my2048Alert .myAt .myAt-text .myAt-text-title span, #my2048Alert .myAt .myAt-text .myAt-text-subtitle span {
144+
color: #f86442;
145+
}
146+
#my2048Alert .myAt .myAt-text .myAt-text-close {
147+
text-decoration: none;
148+
display: block;
149+
width: 7rem;
150+
height: 2rem;
151+
line-height: 2rem;
152+
color: #fff;
153+
background-color: #f76341;
154+
border-radius: 5px;
155+
margin: .3rem auto;
156+
}
157+
#my2048Alert.hide {
158+
opacity: 0;
159+
z-index: 0;
160+
}
161+
#my2048Alert.show {
162+
opacity: 1;
163+
z-index: 9999;
164+
}
165+
#my2048Alert.hide .myAt {
166+
-webkit-transform: scale(.9, .9);
167+
-ms-transform: scale(.9, .9);
168+
-o-transform: scale(.9, .9);
169+
transform: scale(.9, .9);
170+
}
171+
#my2048Alert.show .myAt {
172+
-webkit-transform: scale(1, 1);
173+
-ms-transform: scale(1, 1);
174+
-o-transform: scale(1, 1);
175+
transform: scale(1, 1);
176+
}

2048游戏/img/head.jpg

66 KB
Loading

2048游戏/index.html

Lines changed: 30 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,30 @@
1+
<!DOCTYPE html>
2+
<html>
3+
<head>
4+
<meta charset="UTF-8">
5+
<meta name="viewport" content="width=device-width,height=device-height,initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no" />
6+
<title>Document</title>
7+
<link rel="stylesheet" href="css/style.css" />
8+
<script type="text/javascript" src="../js/jquery-2.1.4.min.js" ></script>
9+
<script type="text/javascript" src="js/my2048.js" ></script>
10+
</head>
11+
<body>
12+
<div class="my2048">
13+
<header>
14+
<h1>my2048</h1>
15+
<a href="javascript:newgame();" id="newgamebutton">重新开始</a>
16+
<p>分数:<span id="score">0</span></p>
17+
</header>
18+
<div id="grid-container"> </div>
19+
<footer>游戏说明:PC端键盘方向键控制↑→↓←<br>手机端左右上下滑屏控制!!</footer>
20+
</div>
21+
<script>
22+
var my2048 = new my2048($("#grid-container"));
23+
my2048.init();
24+
25+
function newgame() {
26+
my2048.init();
27+
}
28+
</script>
29+
</body>
30+
</html>

0 commit comments

Comments
 (0)