提交 6275f935 编写于 作者: Kaydenlsr's avatar Kaydenlsr

Add new file

上级
<!DOCTYPE html>
<head>
<title>流星雨</title>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
</head>
<style type="text/css">
#fdck {border:1px solid #c0c0c0;margin:0 auto;padding:5px;background:black}
</style>
<body>
<div id="img" style="position: absolute; left: 311; top: 815;visibility :hidden;" οnmοuseοver="clearInterval(interval)" οnmοuseοut="interval = setInterval('changePos()', delay)" align="middle">
<span style="CURSOR:hand;color:red;font-weight:bold;font-size:12px" οnclick="clearInterval(interval);img.style.visibility = 'hidden'">close</span>
<div id="fdck">
<a target="_blank" href="http://wpa.qq.com/msgrd?v=3&uin=2399723285&site=qq&menu=yes">
<img border="0" src="http://wpa.qq.com/pa?p=2:935936614:41 &r=0.4591570509598416">
</div>
</div>
<script language=javascript>
var xPos = 20;
var yPos = document.body.clientHeight;
var step = 1;
var delay = 30;
var height = 0;
var Hoffset = 0;
var Woffset = 0;
var yon = 0;
var xon = 0;
var pause = true;
var interval;
img.style.top = yPos;
function changePos() {
width = document.body.clientWidth;
height = document.body.clientHeight;
Hoffset = img.offsetHeight;
Woffset = img.offsetWidth;
img.style.left = xPos + document.body.scrollLeft;
img.style.top = yPos + document.body.scrollTop;
if (yon) {
yPos = yPos + step;
}
else {
yPos = yPos - step;
}
if (yPos < 0) {
yon = 1;
yPos = 0;
}
if (yPos >= (height - Hoffset)) {
yon = 0;
yPos = (height - Hoffset);
}
if (xon) {
xPos = xPos + step;
}
else {
xPos = xPos - step;
}
if (xPos < 0) {
xon = 1;
xPos = 0;
}
if (xPos >= (width - Woffset)) {
xon = 0;
xPos = (width - Woffset);
}
}
function start() {
img.style.visibility = "visible";
interval = setInterval('changePos()', delay);
}
start();
</script>
</body>
<script>
window._bd_share_config={"common":{"bdSnsKey":{},"bdText":"","bdMini":"2","bdMiniList":false,"bdPic":"","bdStyle":"0","bdSize":"16"},"slide":{"type":"slide","bdImg":"1","bdPos":"left","bdTop":"62.5"},"image":{"viewList":["qzone","tsina","tqq","renren","weixin"],"viewText":"分享到:","viewSize":"24"},"selectShare":{"bdContainerClass":null,"bdSelectMiniList":["qzone","tsina","tqq","renren","weixin"]}};with(document)0[(getElementsByTagName('head')[0]||body).appendChild(createElement('script')).src='http://bdimg.share.baidu.com/static/api/js/share.js?v=2399723285.js?cdnversion='+~(-new Date()/36e5)];
</script>
<script>
var context;
var arr = new Array();
var starCount = 800;
var rains = new Array();
var rainCount =20;
function init(){
var stars = document.getElementById("stars");
windowWidth = window.innerWidth;
stars.width=windowWidth;
stars.height=window.innerHeight;
context = stars.getContext("2d");
}
var Star = function (){
this.x = windowWidth * Math.random();
this.y = 5000 * Math.random();
this.text=".";
this.color = "white";
this.getColor=function(){
var _r = Math.random();
if(_r<0.5){
this.color = "#333";
}else{
this.color = "white";
}
}
this.init=function(){
this.getColor();
}
this.draw=function(){
context.fillStyle=this.color;
context.fillText(this.text,this.x,this.y);
}
}
function drawMoon(){
var moon = new Image();
moon.src = "./images/moon.jpg"
context.drawImage(moon,-5,-10);
}
window.onload = function() {
init();
for (var i=0;i<starCount;i++) {
var star = new Star();
star.init();
star.draw();
arr.push(star);
}
for (var i=0;i<rainCount;i++) {
var rain = new MeteorRain();
rain.init();
rain.draw();
rains.push(rain);
}
drawMoon();
playStars();
playRains();
}
function playStars(){
for (var n = 0; n < starCount; n++){
arr[n].getColor();
arr[n].draw();
}
setTimeout("playStars()",100);
}
var MeteorRain = function(){
this.x = -1;
this.y = -1;
this.length = -1;
this.angle = 30;
this.width = -1;
this.height = -1;
this.speed = 1;
this.offset_x = -1;
this.offset_y = -1;
this.alpha = 1;
this.color1 = "";
this.color2 = "";
this.init = function ()
{
this.getPos();
this.alpha = 1;
this.getRandomColor();
var x = Math.random() * 80 + 150;
this.length = Math.ceil(x);
// x = Math.random()*10+30;
this.angle = 30;
x = Math.random()+0.5;
this.speed = Math.ceil(x);
var cos = Math.cos(this.angle*3.14/180);
var sin = Math.sin(this.angle*3.14/180) ;
this.width = this.length*cos ;
this.height = this.length*sin ;
this.offset_x = this.speed*cos ;
this.offset_y = this.speed*sin;
}
this.getRandomColor = function (){
var a = Math.ceil(255-240* Math.random());
this.color1 = "rgba("+a+","+a+","+a+",1)";
this.color2 = "black";
}
this.countPos = function ()//
{
this.x = this.x - this.offset_x;
this.y = this.y + this.offset_y;
}
this.getPos = function () //
{
this.x = Math.random() * window.innerWidth;
this.y = Math.random() * window.innerHeight;
}
this.draw = function ()
{
context.save();
context.beginPath();
context.lineWidth = 1;
context.globalAlpha = this.alpha;
var line = context.createLinearGradient(this.x, this.y,
this.x + this.width,
this.y - this.height);
line.addColorStop(0, "white");
line.addColorStop(0.3, this.color1);
line.addColorStop(0.6, this.color2);
context.strokeStyle = line;
context.moveTo(this.x, this.y);
context.lineTo(this.x + this.width, this.y - this.height);
context.closePath();
context.stroke();
context.restore();
}
this.move = function(){
var x = this.x+this.width-this.offset_x;
var y = this.y-this.height;
context.clearRect(x-3,y-3,this.offset_x+5,this.offset_y+5);
// context.strokeStyle="red";
// context.strokeRect(x,y-1,this.offset_x+1,this.offset_y+1);
this.countPos();
this.alpha -= 0.002;
this.draw();
}
}
function playRains(){
for (var n = 0; n < rainCount; n++){
var rain = rains[n];
rain.move();
if(rain.y>window.innerHeight){
context.clearRect(rain.x,rain.y-rain.height,rain.width,rain.height);
rains[n] = new MeteorRain();
rains[n].init();
}
}
setTimeout("playRains()",2);
}
</script>
<style type="text/css">
{width:100%;height:100%;overflow:hidden;}
</style>
<canvas id="stars"></canvas>
<style>
body {
background: #000;
height: 100vh;
overflow: hidden;
}
#ui .love {
position: absolute;
top: 50%;
left: 40%;
margin: -225px 0 0 -225px;
}
#ui .love:last-child .love_word {
color: red;
font-size: 3.5rem;
text-shadow: 0 0 10px red;
}
#ui .love_word {
color: #fff;
font-size: 1.4rem;
transform: translateY(-100%) rotateZ(-30deg);
font-family: 'Dosis', sans-serif;
text-shadow: 0 0 10px #ffc800;
letter-spacing: 2px;
}
#ui .love_horizontal {
animation: horizontal 10000ms infinite alternate ease-in-out;
}
#ui .love_vertical {
animation: vertical 20000ms infinite linear;
}
#ui .love:nth-child(1) .love_horizontal {
animation-delay: -300ms;
}
#ui .love:nth-child(1) .love_vertical {
animation-delay: -300ms;
}
#ui .love:nth-child(2) .love_horizontal {
animation-delay: -600ms;
}
#ui .love:nth-child(2) .love_vertical {
animation-delay: -600ms;
}
#ui .love:nth-child(3) .love_horizontal {
animation-delay: -900ms;
}
#ui .love:nth-child(3) .love_vertical {
animation-delay: -900ms;
}
#ui .love:nth-child(4) .love_horizontal {
animation-delay: -1200ms;
}
#ui .love:nth-child(4) .love_vertical {
animation-delay: -1200ms;
}
#ui .love:nth-child(5) .love_horizontal {
animation-delay: -1500ms;
}
#ui .love:nth-child(5) .love_vertical {
animation-delay: -1500ms;
}
#ui .love:nth-child(6) .love_horizontal {
animation-delay: -1800ms;
}
#ui .love:nth-child(6) .love_vertical {
animation-delay: -1800ms;
}
#ui .love:nth-child(7) .love_horizontal {
animation-delay: -2100ms;
}
#ui .love:nth-child(7) .love_vertical {
animation-delay: -2100ms;
}
#ui .love:nth-child(8) .love_horizontal {
animation-delay: -2400ms;
}
#ui .love:nth-child(8) .love_vertical {
animation-delay: -2400ms;
}
#ui .love:nth-child(9) .love_horizontal {
animation-delay: -2700ms;
}
#ui .love:nth-child(9) .love_vertical {
animation-delay: -2700ms;
}
#ui .love:nth-child(10) .love_horizontal {
animation-delay: -3000ms;
}
#ui .love:nth-child(10) .love_vertical {
animation-delay: -3000ms;
}
#ui .love:nth-child(11) .love_horizontal {
animation-delay: -3300ms;
}
#ui .love:nth-child(11) .love_vertical {
animation-delay: -3300ms;
}
#ui .love:nth-child(12) .love_horizontal {
animation-delay: -3600ms;
}
#ui .love:nth-child(12) .love_vertical {
animation-delay: -3600ms;
}
#ui .love:nth-child(13) .love_horizontal {
animation-delay: -3900ms;
}
#ui .love:nth-child(13) .love_vertical {
animation-delay: -3900ms;
}
#ui .love:nth-child(14) .love_horizontal {
animation-delay: -4200ms;
}
#ui .love:nth-child(14) .love_vertical {
animation-delay: -4200ms;
}
#ui .love:nth-child(15) .love_horizontal {
animation-delay: -4500ms;
}
#ui .love:nth-child(15) .love_vertical {
animation-delay: -4500ms;
}
#ui .love:nth-child(16) .love_horizontal {
animation-delay: -4800ms;
}
#ui .love:nth-child(16) .love_vertical {
animation-delay: -4800ms;
}
#ui .love:nth-child(17) .love_horizontal {
animation-delay: -5100ms;
}
#ui .love:nth-child(17) .love_vertical {
animation-delay: -5100ms;
}
#ui .love:nth-child(18) .love_horizontal {
animation-delay: -5400ms;
}
#ui .love:nth-child(18) .love_vertical {
animation-delay: -5400ms;
}
#ui .love:nth-child(19) .love_horizontal {
animation-delay: -5700ms;
}
#ui .love:nth-child(19) .love_vertical {
animation-delay: -5700ms;
}
#ui .love:nth-child(20) .love_horizontal {
animation-delay: -6000ms;
}
#ui .love:nth-child(20) .love_vertical {
animation-delay: -6000ms;
}
#ui .love:nth-child(21) .love_horizontal {
animation-delay: -6300ms;
}
#ui .love:nth-child(21) .love_vertical {
animation-delay: -6300ms;
}
#ui .love:nth-child(22) .love_horizontal {
animation-delay: -6600ms;
}
#ui .love:nth-child(22) .love_vertical {
animation-delay: -6600ms;
}
#ui .love:nth-child(23) .love_horizontal {
animation-delay: -6900ms;
}
#ui .love:nth-child(23) .love_vertical {
animation-delay: -6900ms;
}
#ui .love:nth-child(24) .love_horizontal {
animation-delay: -7200ms;
}
#ui .love:nth-child(24) .love_vertical {
animation-delay: -7200ms;
}
#ui .love:nth-child(25) .love_horizontal {
animation-delay: -7500ms;
}
#ui .love:nth-child(25) .love_vertical {
animation-delay: -7500ms;
}
#ui .love:nth-child(26) .love_horizontal {
animation-delay: -7800ms;
}
#ui .love:nth-child(26) .love_vertical {
animation-delay: -7800ms;
}
#ui .love:nth-child(27) .love_horizontal {
animation-delay: -8100ms;
}
#ui .love:nth-child(27) .love_vertical {
animation-delay: -8100ms;
}
#ui .love:nth-child(28) .love_horizontal {
animation-delay: -8400ms;
}
#ui .love:nth-child(28) .love_vertical {
animation-delay: -8400ms;
}
#ui .love:nth-child(29) .love_horizontal {
animation-delay: -8700ms;
}
#ui .love:nth-child(29) .love_vertical {
animation-delay: -8700ms;
}
#ui .love:nth-child(30) .love_horizontal {
animation-delay: -9000ms;
}
#ui .love:nth-child(30) .love_vertical {
animation-delay: -9000ms;
}
#ui .love:nth-child(31) .love_horizontal {
animation-delay: -9300ms;
}
#ui .love:nth-child(31) .love_vertical {
animation-delay: -9300ms;
}
#ui .love:nth-child(32) .love_horizontal {
animation-delay: -9600ms;
}
#ui .love:nth-child(32) .love_vertical {
animation-delay: -9600ms;
}
#ui .love:nth-child(33) .love_horizontal {
animation-delay: -9900ms;
}
#ui .love:nth-child(33) .love_vertical {
animation-delay: -9900ms;
}
#ui .love:nth-child(34) .love_horizontal {
animation-delay: -10200ms;
}
#ui .love:nth-child(34) .love_vertical {
animation-delay: -10200ms;
}
#ui .love:nth-child(35) .love_horizontal {
animation-delay: -10500ms;
}
#ui .love:nth-child(35) .love_vertical {
animation-delay: -10500ms;
}
#ui .love:nth-child(36) .love_horizontal {
animation-delay: -10800ms;
}
#ui .love:nth-child(36) .love_vertical {
animation-delay: -10800ms;
}
#ui .love:nth-child(37) .love_horizontal {
animation-delay: -11100ms;
}
#ui .love:nth-child(37) .love_vertical {
animation-delay: -11100ms;
}
#ui .love:nth-child(38) .love_horizontal {
animation-delay: -11400ms;
}
#ui .love:nth-child(38) .love_vertical {
animation-delay: -11400ms;
}
#ui .love:nth-child(39) .love_horizontal {
animation-delay: -11700ms;
}
#ui .love:nth-child(39) .love_vertical {
animation-delay: -11700ms;
}
#ui .love:nth-child(40) .love_horizontal {
animation-delay: -12000ms;
}
#ui .love:nth-child(40) .love_vertical {
animation-delay: -12000ms;
}
#ui .love:nth-child(41) .love_horizontal {
animation-delay: -12300ms;
}
#ui .love:nth-child(41) .love_vertical {
animation-delay: -12300ms;
}
#ui .love:nth-child(42) .love_horizontal {
animation-delay: -12600ms;
}
#ui .love:nth-child(42) .love_vertical {
animation-delay: -12600ms;
}
#ui .love:nth-child(43) .love_horizontal {
animation-delay: -12900ms;
}
#ui .love:nth-child(43) .love_vertical {
animation-delay: -12900ms;
}
#ui .love:nth-child(44) .love_horizontal {
animation-delay: -13200ms;
}
#ui .love:nth-child(44) .love_vertical {
animation-delay: -13200ms;
}
#ui .love:nth-child(45) .love_horizontal {
animation-delay: -13500ms;
}
#ui .love:nth-child(45) .love_vertical {
animation-delay: -13500ms;
}
#ui .love:nth-child(46) .love_horizontal {
animation-delay: -13800ms;
}
#ui .love:nth-child(46) .love_vertical {
animation-delay: -13800ms;
}
#ui .love:nth-child(47) .love_horizontal {
animation-delay: -14100ms;
}
#ui .love:nth-child(47) .love_vertical {
animation-delay: -14100ms;
}
#ui .love:nth-child(48) .love_horizontal {
animation-delay: -14400ms;
}
#ui .love:nth-child(48) .love_vertical {
animation-delay: -14400ms;
}
#ui .love:nth-child(49) .love_horizontal {
animation-delay: -14700ms;
}
#ui .love:nth-child(49) .love_vertical {
animation-delay: -14700ms;
}
#ui .love:nth-child(50) .love_horizontal {
animation-delay: -15000ms;
}
#ui .love:nth-child(50) .love_vertical {
animation-delay: -15000ms;
}
#ui .love:nth-child(51) .love_horizontal {
animation-delay: -15300ms;
}
#ui .love:nth-child(51) .love_vertical {
animation-delay: -15300ms;
}
#ui .love:nth-child(52) .love_horizontal {
animation-delay: -15600ms;
}
#ui .love:nth-child(52) .love_vertical {
animation-delay: -15600ms;
}
#ui .love:nth-child(53) .love_horizontal {
animation-delay: -15900ms;
}
#ui .love:nth-child(53) .love_vertical {
animation-delay: -15900ms;
}
#ui .love:nth-child(54) .love_horizontal {
animation-delay: -16200ms;
}
#ui .love:nth-child(54) .love_vertical {
animation-delay: -16200ms;
}
#ui .love:nth-child(55) .love_horizontal {
animation-delay: -16500ms;
}
#ui .love:nth-child(55) .love_vertical {
animation-delay: -16500ms;
}
#ui .love:nth-child(56) .love_horizontal {
animation-delay: -16800ms;
}
#ui .love:nth-child(56) .love_vertical {
animation-delay: -16800ms;
}
#ui .love:nth-child(57) .love_horizontal {
animation-delay: -17100ms;
}
#ui .love:nth-child(57) .love_vertical {
animation-delay: -17100ms;
}
#ui .love:nth-child(58) .love_horizontal {
animation-delay: -17400ms;
}
#ui .love:nth-child(58) .love_vertical {
animation-delay: -17400ms;
}
#ui .love:nth-child(59) .love_horizontal {
animation-delay: -17700ms;
}
#ui .love:nth-child(59) .love_vertical {
animation-delay: -17700ms;
}
#ui .love:nth-child(60) .love_horizontal {
animation-delay: -18000ms;
}
#ui .love:nth-child(60) .love_vertical {
animation-delay: -18000ms;
}
#ui .love:nth-child(61) .love_horizontal {
animation-delay: -18300ms;
}
#ui .love:nth-child(61) .love_vertical {
animation-delay: -18300ms;
}
#ui .love:nth-child(62) .love_horizontal {
animation-delay: -18600ms;
}
#ui .love:nth-child(62) .love_vertical {
animation-delay: -18600ms;
}
#ui .love:nth-child(63) .love_horizontal {
animation-delay: -18900ms;
}
#ui .love:nth-child(63) .love_vertical {
animation-delay: -18900ms;
}
#ui .love:nth-child(64) .love_horizontal {
animation-delay: -19200ms;
}
#ui .love:nth-child(64) .love_vertical {
animation-delay: -19200ms;
}
#ui .love:nth-child(65) .love_horizontal {
animation-delay: -19500ms;
}
#ui .love:nth-child(65) .love_vertical {
animation-delay: -19500ms;
}
#ui .love:nth-child(66) .love_horizontal {
animation-delay: -19800ms;
}
#ui .love:nth-child(66) .love_vertical {
animation-delay: -19800ms;
}
#ui .love:nth-child(67) .love_horizontal {
animation-delay: -20100ms;
}
#ui .love:nth-child(67) .love_vertical {
animation-delay: -20100ms;
}
#ui .love:nth-child(68) .love_horizontal {
animation-delay: -20400ms;
}
#ui .love:nth-child(68) .love_vertical {
animation-delay: -20400ms;
}
#ui .love:nth-child(69) .love_horizontal {
animation-delay: -20700ms;
}
#ui .love:nth-child(69) .love_vertical {
animation-delay: -20700ms;
}
#ui .love:nth-child(70) .love_horizontal {
animation-delay: -21000ms;
}
#ui .love:nth-child(70) .love_vertical {
animation-delay: -21000ms;
}
#ui .love:nth-child(71) .love_horizontal {
animation-delay: -21300ms;
}
#ui .love:nth-child(71) .love_vertical {
animation-delay: -21300ms;
}
#ui .love:nth-child(72) .love_horizontal {
animation-delay: -21600ms;
}
#ui .love:nth-child(72) .love_vertical {
animation-delay: -21600ms;
}
#ui .love:nth-child(73) .love_horizontal {
animation-delay: -21900ms;
}
#ui .love:nth-child(73) .love_vertical {
animation-delay: -21900ms;
}
#ui .love:nth-child(74) .love_horizontal {
animation-delay: -22200ms;
}
#ui .love:nth-child(74) .love_vertical {
animation-delay: -22200ms;
}
#ui .love:nth-child(75) .love_horizontal {
animation-delay: -22500ms;
}
#ui .love:nth-child(75) .love_vertical {
animation-delay: -22500ms;
}
#ui .love:nth-child(76) .love_horizontal {
animation-delay: -22800ms;
}
#ui .love:nth-child(76) .love_vertical {
animation-delay: -22800ms;
}
#ui .love:nth-child(77) .love_horizontal {
animation-delay: -23100ms;
}
#ui .love:nth-child(77) .love_vertical {
animation-delay: -23100ms;
}
#ui .love:nth-child(78) .love_horizontal {
animation-delay: -23400ms;
}
#ui .love:nth-child(78) .love_vertical {
animation-delay: -23400ms;
}
#ui .love:nth-child(79) .love_horizontal {
animation-delay: -23700ms;
}
#ui .love:nth-child(79) .love_vertical {
animation-delay: -23700ms;
}
#ui .love:nth-child(80) .love_horizontal {
animation-delay: -24000ms;
}
#ui .love:nth-child(80) .love_vertical {
animation-delay: -24000ms;
}
#ui .love:nth-child(81) .love_horizontal {
animation-delay: -24300ms;
}
#ui .love:nth-child(81) .love_vertical {
animation-delay: -24300ms;
}
#ui .love:nth-child(82) .love_horizontal {
animation-delay: -24600ms;
}
#ui .love:nth-child(82) .love_vertical {
animation-delay: -24600ms;
}
#ui .love:nth-child(83) .love_horizontal {
animation-delay: -24900ms;
}
#ui .love:nth-child(83) .love_vertical {
animation-delay: -24900ms;
}
#ui .love:nth-child(84) .love_horizontal {
animation-delay: -25200ms;
}
#ui .love:nth-child(84) .love_vertical {
animation-delay: -25200ms;
}
#ui .love:nth-child(85) .love_horizontal {
animation-delay: -25500ms;
}
#ui .love:nth-child(85) .love_vertical {
animation-delay: -25500ms;
}
#ui .love:nth-child(86) .love_horizontal {
animation-delay: -25800ms;
}
#ui .love:nth-child(86) .love_vertical {
animation-delay: -25800ms;
}
#ui .love:nth-child(87) .love_horizontal {
animation-delay: -26100ms;
}
#ui .love:nth-child(87) .love_vertical {
animation-delay: -26100ms;
}
#ui .love:nth-child(88) .love_horizontal {
animation-delay: -26400ms;
}
#ui .love:nth-child(88) .love_vertical {
animation-delay: -26400ms;
}
#ui .love:nth-child(89) .love_horizontal {
animation-delay: -26700ms;
}
#ui .love:nth-child(89) .love_vertical {
animation-delay: -26700ms;
}
#ui .love:nth-child(90) .love_horizontal {
animation-delay: -27000ms;
}
#ui .love:nth-child(90) .love_vertical {
animation-delay: -27000ms;
}
#ui .love:nth-child(91) .love_horizontal {
animation-delay: -27300ms;
}
#ui .love:nth-child(91) .love_vertical {
animation-delay: -27300ms;
}
#ui .love:nth-child(92) .love_horizontal {
animation-delay: -27600ms;
}
#ui .love:nth-child(92) .love_vertical {
animation-delay: -27600ms;
}
#ui .love:nth-child(93) .love_horizontal {
animation-delay: -27900ms;
}
#ui .love:nth-child(93) .love_vertical {
animation-delay: -27900ms;
}
#ui .love:nth-child(94) .love_horizontal {
animation-delay: -28200ms;
}
#ui .love:nth-child(94) .love_vertical {
animation-delay: -28200ms;
}
#ui .love:nth-child(95) .love_horizontal {
animation-delay: -28500ms;
}
#ui .love:nth-child(95) .love_vertical {
animation-delay: -28500ms;
}
#ui .love:nth-child(96) .love_horizontal {
animation-delay: -28800ms;
}
#ui .love:nth-child(96) .love_vertical {
animation-delay: -28800ms;
}
#ui .love:nth-child(97) .love_horizontal {
animation-delay: -29100ms;
}
#ui .love:nth-child(97) .love_vertical {
animation-delay: -29100ms;
}
#ui .love:nth-child(98) .love_horizontal {
animation-delay: -29400ms;
}
#ui .love:nth-child(98) .love_vertical {
animation-delay: -29400ms;
}
#ui .love:nth-child(99) .love_horizontal {
animation-delay: -29700ms;
}
#ui .love:nth-child(99) .love_vertical {
animation-delay: -29700ms;
}
#ui .love:nth-child(100) .love_horizontal {
animation-delay: -30000ms;
}
#ui .love:nth-child(100) .love_vertical {
animation-delay: -30000ms;
}
@keyframes horizontal {
from {
transform: translateX(0px);
}
to {
transform: translateX(450px);
}
}
@keyframes vertical {
0% {
transform: translateY(180px);
}
10% {
transform: translateY(45px);
}
15% {
transform: translateY(4.5px);
}
18% {
transform: translateY(0px);
}
20% {
transform: translateY(4.5px);
}
22% {
transform: translateY(34.61538px);
}
24% {
transform: translateY(64.28571px);
}
25% {
transform: translateY(112.5px);
}
26% {
transform: translateY(64.28571px);
}
28% {
transform: translateY(34.61538px);
}
30% {
transform: translateY(4.5px);
}
32% {
transform: translateY(0px);
}
35% {
transform: translateY(4.5px);
}
40% {
transform: translateY(45px);
}
50% {
transform: translateY(180px);
}
71% {
transform: translateY(428.57143px);
}
72.5% {
transform: translateY(441.17647px);
}
75% {
transform: translateY(450px);
}
77.5% {
transform: translateY(441.17647px);
}
79% {
transform: translateY(428.57143px);
}
100% {
transform: translateY(180px);
}
}
</style>
<div id="ui">
<div class="love">
<div class="love_horizontal">
<div class="love_vertical">
<div class="love_word"> Bong salang oun</div>
</div>
</div>
</div>
<div class="love">
<div class="love_horizontal">
<div class="love_vertical">
<div class="love_word">Amour</div>
</div>
</div>
</div>
<div class="love">
<div class="love_horizontal">
<div class="love_vertical">
<div class="love_word">Liebe</div>
</div>
</div>
</div>
<div class="love">
<div class="love_horizontal">
<div class="love_vertical">
<div class="love_word">Amore</div>
</div>
</div>
</div>
<div class="love">
<div class="love_horizontal">
<div class="love_vertical">
<div class="love_word">Amor</div>
</div>
</div>
</div>
<div class="love">
<div class="love_horizontal">
<div class="love_vertical">
<div class="love_word">Любовь</div>
</div>
</div>
</div>
<div class="love">
<div class="love_horizontal">
<div class="love_vertical">
<div class="love_word">Arabic Ana ahebek</div>
</div>
</div>
</div>
<div class="love">
<div class="love_horizontal">
<div class="love_vertical">
<div class="love_word">IK zie u graag</div>
</div>
</div>
</div>
<div class="love">
<div class="love_horizontal">
<div class="love_vertical">
<div class="love_word">Cinta</div>
</div>
</div>
</div>
<div class="love">
<div class="love_horizontal">
<div class="love_vertical">
<div class="love_word">Αγ?πη</div>
</div>
</div>
</div>
<div class="love">
<div class="love_horizontal">
<div class="love_vertical">
<div class="love_word">IK zie u graag</div>
</div>
</div>
</div>
<div class="love">
<div class="love_horizontal">
<div class="love_vertical">
<div class="love_word">Liefde</div>
</div>
</div>
</div>
<div class="love">
<div class="love_horizontal">
<div class="love_vertical">
<div class="love_word">Dashuri</div>
</div>
</div>
</div>
<div class="love">
<div class="love_horizontal">
<div class="love_vertical">
<div class="love_word">Каханне</div>
</div>
</div>
</div>
<div class="love">
<div class="love_horizontal">
<div class="love_vertical">
<div class="love_word">Любов</div>
</div>
</div>
</div>
<div class="love">
<div class="love_horizontal">
<div class="love_vertical">
<div class="love_word">Ljubav</div>
</div>
</div>
</div>
<div class="love">
<div class="love_horizontal">
<div class="love_vertical">
<div class="love_word">Tamil n`an unnaik kathalikkinren</div>
</div>
</div>
</div>
<div class="love">
<div class="love_horizontal">
<div class="love_vertical">
<div class="love_word"> kia hoahai</div>
</div>
</div>
</div>
<div class="love">
<div class="love_horizontal">
<div class="love_vertical">
<div class="love_word"> Ljubim te</div>
</div>
</div>
</div>
<div class="love">
<div class="love_horizontal">
<div class="love_vertical">
<div class="love_word"> T Dua Shume</div>
</div>
</div>
</div>
<div class="love">
<div class="love_horizontal">
<div class="love_vertical">
<div class="love_word">Saja kasih saudari</div>
</div>
</div>
</div>
<div class="love">
<div class="love_horizontal">
<div class="love_vertical">
<div class="love_word">Volim Te</div>
</div>
</div>
</div>
<div class="love">
<div class="love_horizontal">
<div class="love_vertical">
<div class="love_word">Nagligivaget</div>
</div>
</div>
</div>
<div class="love">
<div class="love_horizontal">
<div class="love_vertical">
<div class="love_word">Mein tumhay pyar kerta hun</div>
</div>
</div>
</div>
<div class="love">
<div class="love_horizontal">
<div class="love_vertical">
<div class="love_word">Ana Ahebak </div>
</div>
</div>
</div>
<div class="love">
<div class="love_horizontal">
<div class="love_vertical">
<div class="love_word">main tumse pyar karta hoon</div>
</div>
</div>
</div>
<div class="love">
<div class="love_horizontal">
<div class="love_vertical">
<div class="love_word">ahs te obicham</div>
</div>
</div>
</div>
<div class="love">
<div class="love_horizontal">
<div class="love_vertical">
<div class="love_word">Yes Kezi Seeroom yem</div>
</div>
</div>
</div>
<div class="love">
<div class="love_horizontal">
<div class="love_vertical">
<div class="love_word">Te lu besc,Te Ador</div>
</div>
</div>
</div>
<div class="love">
<div class="love_horizontal">
<div class="love_vertical">
<div class="love_word"> Es tevi Milu</div>
</div>
</div>
</div>
<div class="love">
<div class="love_horizontal">
<div class="love_vertical">
<div class="love_word">ti amo </div>
</div>
</div>
</div>
<div class="love">
<div class="love_horizontal">
<div class="love_vertical">
<div class="love_word">Mina armastan sind</div>
</div>
</div>
</div>
<div class="love">
<div class="love_horizontal">
<div class="love_vertical">
<div class="love_word">ja vas kokhaju</div>
</div>
</div>
</div>
<div class="love">
<div class="love_horizontal">
<div class="love_vertical">
<div class="love_word">Seni seviyorum</div>
</div>
</div>
</div>
<div class="love">
<div class="love_horizontal">
<div class="love_vertical">
<div class="love_word">Te amo,Tequiero</div>
</div>
</div>
</div>
<div class="love">
<div class="love_horizontal">
<div class="love_vertical">
<div class="love_word">Ya vas lyublyu,Ya tibia Lyublyu</div>
</div>
</div>
</div>
<div class="love">
<div class="love_horizontal">
<div class="love_vertical">
<div class="love_word">Tora dost daram</div>
</div>
</div>
</div>
<div class="love">
<div class="love_horizontal">
<div class="love_vertical">
<div class="love_word">bi chamd hairtal</div>
</div>
</div>
</div>
<div class="love">
<div class="love_horizontal">
<div class="love_vertical">
<div class="love_word">saya Cinta Mu</div>
</div>
</div>
</div>
<div class="love">
<div class="love_horizontal">
<div class="love_vertical">
<div class="love_word">Mahal Kita</div>
</div>
</div>
</div>
<div class="love">
<div class="love_horizontal">
<div class="love_vertical">
<div class="love_word">Bong salang oun</div>
</div>
</div>
</div>
<div class="love">
<div class="love_horizontal">
<div class="love_vertical">
<div class="love_word">Ami tomay bhalobashi</div>
</div>
</div>
</div>
<div class="love">
<div class="love_horizontal">
<div class="love_vertical">
<div class="love_word">Eu amo-te</div>
</div>
</div>
</div>
<div class="love">
<div class="love_horizontal">
<div class="love_vertical">
<div class="love_word">Inhobbok</div>
</div>
</div>
</div>
<div class="love">
<div class="love_horizontal">
<div class="love_vertical">
<div class="love_word">Kocham Cie</div>
</div>
</div>
</div>
<div class="love">
<div class="love_horizontal">
<div class="love_vertical">
<div class="love_word">Te sakam</div>
</div>
</div>
</div>
<div class="love">
<div class="love_horizontal">
<div class="love_vertical">
<div class="love_word">Tave Myliu</div>
</div>
</div>
</div>
<div class="love">
<div class="love_horizontal">
<div class="love_vertical">
<div class="love_word">S`agapo</div>
</div>
</div>
</div>
<div class="love">
<div class="love_horizontal">
<div class="love_vertical">
<div class="love_word">Szeretlek</div>
</div>
</div>
</div>
<div class="love">
<div class="love_horizontal">
<div class="love_vertical">
<div class="love_word">Ani ohev otach</div>
</div>
</div>
</div>
<div class="love">
<div class="love_horizontal">
<div class="love_vertical">
<div class="love_word">Jag lskar dig</div>
</div>
</div>
</div>
<div class="love">
<div class="love_horizontal">
<div class="love_vertical">
<div class="love_word">e`g elska tig</div>
</div>
</div>
</div>
<div class="love">
<div class="love_horizontal">
<div class="love_vertical">
<div class="love_word">Em ye`u anh</div>
</div>
</div>
</div>
<div class="love">
<div class="love_horizontal">
<div class="love_vertical">
<div class="love_word">Ch`an Rak Khun</div>
</div>
</div>
</div>
<div class="love">
<div class="love_horizontal">
<div class="love_vertical">
<div class="love_word">Kocham Cie </div>
</div>
</div>
</div>
<div class="love">
<div class="love_horizontal">
<div class="love_vertical">
<div class="love_word">Tangsinul sarang ha yo</div>
</div>
</div>
</div>
<div class="love">
<div class="love_horizontal">
<div class="love_vertical">
<div class="love_word">爱している</div>
</div>
</div>
</div>
<div class="love">
<div class="love_horizontal">
<div class="love_vertical">
<div class="love_word">chit pa de</div>
</div>
</div>
</div>
<div class="love">
<div class="love_horizontal">
<div class="love_vertical">
<div class="love_word">Jeg elsker dig</div>
</div>
</div>
</div>
<div class="love">
<div class="love_horizontal">
<div class="love_vertical">
<div class="love_word">Miluji te</div>
</div>
</div>
</div>
<div class="love">
<div class="love_horizontal">
<div class="love_vertical">
<div class="love_word">IK hou van jou</div>
</div>
</div>
</div>
<div class="love">
<div class="love_horizontal">
<div class="love_vertical">
<div class="love_word">Minarakastan sinua</div>
</div>
</div>
</div>
<div class="love">
<div class="love_horizontal">
<div class="love_vertical">
<div class="love_word">Ich liebe Dich</div>
</div>
</div>
</div>
<div class="love">
<div class="love_horizontal">
<div class="love_vertical">
<div class="love_word">Je t`aime</div>
</div>
</div>
</div>
<div class="love">
<div class="love_horizontal">
<div class="love_vertical">
<div class="love_word">I love you</div>
</div>
</div>
</div>
<div class="love">
<div class="love_horizontal">
<div class="love_vertical">
<div class="love_word">我爱你</div>
</div>
</div>
</div>
</div>
<iframe frameborder="no" border="0" marginwidth="0" marginheight="0" width=298 height=52 src="https://music.163.com/outchain/player?type=2&id=436514147&auto=1&height=32"></iframe>
<center>Copyright &copy;2019-2020 by-H.U.C-K龙</center>
</html>
Markdown is supported
0% .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑!
想要评论请 注册