<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=0">
<title>chichichi</title>
<style>
*{
margin: 0;
padding: 0;
}
.c_body{
width: 100%;
height: auto;
}
.c_body img {
width: 35%;
height: auto;
}
.fl_left{
float: left;
}
.fl_right{
float: right;
}
.bifen{
position: relative;
top: 50px;
}
.jineng{
width: 100%;
position: relative;
top:80px;
}
.jineng img{
float: left;
width: 35px;
height: 35px;
margin-left: 15px;
}
.kuang{
width: 60%;
height: 150px;
border:1px solid #DADADA;
position: relative;
top: 130px;
overflow: auto;
}
.shuru{
border:1px solid #DADADA;
width: 70%;
height: 20px;
position: absolute;
bottom: 30px;
right: 35px;
}
.zhanchang{
position: absolute;
bottom: 30px;
left: 0;
font-size: 15px;
}
.btn{
width: 35px;
position: absolute;
bottom: 30px;
right: 0;
background: white;
border:1px solid #DADADA;
}
.xiaoxi{
float: left;
position: absolute;
letter-spacing: 1px;
font-size: 15px;
color: #C1C1C1;
}
.zhanji{
width: 80%;
height: 50px;
position: fixed;
top:40%;
left: 10%;
background-color: #DADADA;
z-index: 9999;
display: none;
}
.zhanji p{
position: absolute;
right: 0;
top:0;
}
.zhanji span{
line-height: 50px;
}
.zuobian{
margin-left: 20px;
}
.biubiu{
position: absolute;
top: 30px;
left: 35%;
font-size: 18px;
color: #C1C1C1;
display: none;
}
.jisha{
position: absolute;
z-index: 9998;
top: 300px;
right: 20px;
display: none;
}
#huangdi{
position: absolute;
z-index: 9998;
top: 300px;
right: 10%;
width: 80%;
display: none;
}
</style>
</head>
<body>
<div class="c_body">
<img src="http://img1.ph.126.net/WINTD-leWQcNF_gYM8JMyw==/6632182670492603818.png" class="fl_left">
<p class="biubiu" id="biubiu">-------->biubiubiu~~</p>
<img src="http://img2.ph.126.net/RS5N8ihq_KfnZlbNC_odAg==/6632179371957720503.png" class="fl_right">
</div>
<img src="http://img1.ph.126.net/6r8Gm-y9O5iXhVhMuS_4vQ==/6632118898818189337.png" class="bifen" id="bifen">
<img src="http://img2.ph.126.net/h68oyhe3YRgX3GdTEW519w==/6631852817004272723.png" class="jisha" id="jisha">
<img src="http://img0.ph.126.net/SPSTMVDifTqhDo5ZIN3DoQ==/6632311313350382157.png" id="huangdi">
<div class="zhanji" id="zhanji">
<span class="zuobian">迟迟迟</span>
<span class="zuobian">翎羽山庄</span>
<span class="zuobian" id="jishu">0</span>
<span>/0/0</span>
<p id="guanbi">X</p>
</div>
<div class="jineng">
<img src="http://img1.ph.126.net/xAsq4ikWWOtzgYyC-g90gw==/6632269531908528466.png" onclick="biushan();jisha1();shuzi();huangdidong()">
<img src="http://img0.ph.126.net/SH8A1jEOQ4ECZSpnzQqV_g==/6632412468420142782.png" onclick="biushan();jisha1();shuzi();huangdidong()">
<img src="http://img0.ph.126.net/opaf6TuieY9myHG0hsKX5Q==/6632343199187590962.png" onclick="biushan();jisha1();shuzi();huangdidong()">
<img src="http://img2.ph.126.net/0ZdrOQKA-alJMmmHnST4ug==/6632085913469361362.png" onclick="biushan();jisha1();shuzi();huangdidong()">
</div>
<div class="kuang">
<p class="xiaoxi" id="xiaoxi"></p>
</div>
<p class="zhanchang">战场</p>
<input type="text" class="shuru" id="shuru">
<input type="button" class="btn" value="发送" id="btn">
</body>
<script>
var bifen = document.getElementById("bifen");
var zhanji = document.getElementById("zhanji");
var guanbi = document.getElementById("guanbi");
//战绩开关
bifen.onclick = function () {
zhanji.style.display = "block";
};
guanbi.onclick = function () {
zhanji.style.display = "none";
};
//弹出biubiubiu~~
var biubiu = document.getElementById("biubiu");
function biushan() {
biubiu.style.display = "inline";
setTimeout("biubiu.style.display = 'none'",500);
}
//弹出击杀效果
var jisha = document.getElementById("jisha");
function jisha1() {
jisha.style.display = "block";
var speed = 1;
var qishi = 300;
var dingshi = setInterval(function () {
if (qishi< 150){
clearTimeout(dingshi);
jisha.style.opacity = 100;
jisha.style.top = "300px";
jisha.style.display = "none";
}else {
qishi = qishi-speed;
jisha.style.top = qishi + "px";
jisha.style.opacity = 0;
jisha.style.transition = "opacity 2s";
}
},10)
}
//人头计数
var jishu = document.getElementById("jishu");
var x = 0;
function shuzi() {
x++;
jishu.innerHTML = x;
}
//炎黄附体
var huangdi = document.getElementById("huangdi");
var rentou;
var yushu;
var xiaoxi = document.getElementById("xiaoxi");
function huangdidong() {
rentou = jishu.innerText;
yushu = rentou%10;
if (yushu == 0){
huangdi.style.display = "block";
var n =1;
var huangdidong1 = setInterval(function doudong() {
if (n<20){
n++;
setTimeout("huangdi.style.top = '305px'",100);
setTimeout("huangdi.style.top = '300px'",50);
}else {
clearInterval(huangdidong1);
huangdi.style.display = "none";
}
},100);
var xiaoxi1 = xiaoxi.innerHTML ;
xiaoxi.innerHTML = xiaoxi1 + "迟迟迟 真是皇帝附体!连续击杀了10个对手竟一次未败! <br />"
}else {
}
}
//发送按钮 辣鸡迟!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!
var btn = document.getElementById("btn");
var shuru = document.getElementById("shuru");
btn.onclick = function () {
xiaoxi.innerHTML += shuru.value + "<br />";
shuru.value = "";
}
</script>
</html>
如人饮水,冷暖自知.
好歹还有联系,知足了,真的.
2017,5.2