<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>入我相思门，知我相思苦</title>
<link rel="icon" href="./image/ax.png" type="image/x-icon" />
<link rel="stylesheet" href="./css/iconfont.css">
<link rel="stylesheet" href="./css/t.css">
</head>
<body>
<canvas id="c">
</canvas>
<div class="snowback">
<div class="ziti" id="ziti">
<span id="world">山有木兮木有枝，心悦君兮君不知</span>
</div>
<div class="main">
<div class="box">
<ul class="zhoxian1">
<li class="small idv1"><img src="./image/img/1.jpg" alt=""></li>
<li class="small idv2"><img src="./image/img/2.jpg" alt=""></li>
<li class="small idv3"><img src="./image/img/3.jpg" alt=""></li>
<li class="small idv4"><img src="./image/img/4.jpg" alt=""></li>
<li class="small idv5"><img src="./image/img/5.jpg" alt=""></li>
<li class="small idv6"><img src="./image/img/6.jpg" alt=""></li>
</ul>
</div>
<div class="box-biger">
<ul class="zhoxian2">
<li class="biger idv7"><img src="./image/img/=1.jpg" alt=""></li>
<li class="biger idv2"><img src="./image/img/=2.jpg" alt=""></li>
<li class="biger idv3"><img src="./image/img/=3.jpg" alt=""></li>
<li class="biger idv4"><img src="./image/img/=4.jpg" alt=""></li>
<li class="biger idv5"><img src="./image/img/=5.jpg" alt=""></li>
<li class="biger idv12"><img src="./image/img/=6.jpg" alt=""></li>
</ul>
</div>
</div>
</div>
<div class="btn btnonlond" onClick="biggen()">
<img class="btnimg" src="./image/mypic.gif" alt="">
<div class="hiddenbox">
<div class="audiobox">
<audio class="myaudio" src="./music/mp3/pygh.mp3" autoplay controls loop></audio>
</div>
<input type="text" placeholder="请输入音乐名称">
<div class="btn inpbtn" onClick="inpbtnc()">放这个</div>
</div>
</div>
</body>
<script src="./js/jquery.min.js"></script>
<script src="./js/TweenMax.min.js"></script>
<script src="./js/script.js"></script>
<script src="./js/snow.js"></script>
<script>
var zhoxian = document.querySelector(".zhoxian1");
var zhoxian2 = document.querySelector(".zhoxian2");
var yesno = 1;
setInterval(function xuanzhuan() {
if (yesno > 2) {
var ss = Math.random();
if (ss < 0.5) {
leftbut();
} else {
rigthtop();
}
} else {
yesno++;
}
}, 500);
var ysize1 = 0,
xsize2 = 0;
rigthtop()
function rigthtop() {
var suiji = Math.random();
ysize1 += 1 * (suiji * 20).toFixed(0) + 20;
xsize2 += 1 * (suiji * 10).toFixed(0) + 10;
var world = `rotateY(${ysize1}deg) rotateX(${xsize2}deg)`;
zhoxian.style.transform = world;
zhoxian2.style.transform = world;
yesno = 0;
}
function leftbut() {
var suiji1 = Math.random();
ysize1 -= 1 * (suiji1 * 20).toFixed(0) + 20;
xsize2 -= 1 * (suiji1 * 10).toFixed(0) + 10;
var world = `rotateY(${ysize1}deg) rotateX(${xsize2}deg)`;
zhoxian.style.transform = world;
zhoxian2.style.transform = world;
yesno = 0;
}
function onlyleft() {
var suiji1 = Math.random();
ysize1 -= 1 * (suiji1 * 20).toFixed(0) + 20;
var world = `rotateY(${ysize1}deg) rotateX(${xsize2}deg)`;
zhoxian.style.transform = world;
zhoxian2.style.transform = world;
yesno = 0;
}
function onlyright() {
var suiji = Math.random();
ysize1 += 1 * (suiji * 20).toFixed(0) + 20;
var world = `rotateY(${ysize1}deg) rotateX(${xsize2}deg)`;
zhoxian.style.transform = world;
zhoxian2.style.transform = world;
yesno = 0;
}
function onlytop() {
var suiji1 = Math.random();
xsize2 -= 1 * (suiji1 * 10).toFixed(0) + 10;
var world = `rotateY(${ysize1}deg) rotateX(${xsize2}deg)`;
zhoxian.style.transform = world;
zhoxian2.style.transform = world;
yesno = 0;
}
function onlybtn() {
var suiji = Math.random();
xsize2 += 1 * (suiji * 10).toFixed(0) + 10;
var world = `rotateY(${ysize1}deg) rotateX(${xsize2}deg)`;
zhoxian.style.transform = world;
zhoxian2.style.transform = world;
yesno = 0;
}
document.querySelector(".box-biger").onmousedown = function (evt) {
var oevent = evt || event;
var disx = oevent.clientX;
var disy = oevent.clientY;
document.onmousemove = function (evt) {
var oevent = evt || event;
evt.preventDefault();
tuozhuaiX = oevent.clientX - disx + 'px';
tuozhuaiY = oevent.clientY - disy + 'px';
}
document.onmouseup = function () {
if (parseInt(tuozhuaiX) * parseInt(tuozhuaiX) > parseInt(tuozhuaiY) * parseInt(tuozhuaiY)) {
if (tuozhuaiX[0] == '-') {
onlyleft();
} else {
onlyright();
}
} else {
if (tuozhuaiY[0] == '-') {
onlybtn();
} else {
onlytop();
}
}
document.onmousemove = null;
document.onmouseup = null;
}
}
var moustime = 0;
document.getElementById("ziti").addEventListener("mouseenter", moveon);
function moveon() {
moustime++;
setTimeout(function () {
if (moustime == 1) {
document.getElementById("world").innerHTML = "曾经沧海难为水，除却巫山不是云";
moveon();
} else if (moustime == 2) {
document.getElementById("world").innerHTML =
`<span class="iconfont icon-bqxin">人生自是有情痴，此恨不关风与月。<span class="iconfont icon-bqxin">`;
moveon();
} else if (moustime == 5) {
document.getElementById("world").innerHTML =
`<span class="iconfont icon-bqxin">身无彩凤双飞翼，心有灵犀一点通<span class="iconfont icon-bqxin">`;
} else {
moveon();
}
}, 2000)
}
document.getElementById("ziti").addEventListener("mouseleave", function () {
moustime = 0;
document.getElementById("world").innerHTML =
`<span class="iconfont icon-bqxin">人生若只如初见，何事秋风悲画扇<span class="iconfont icon-bqxin">`;
});
</script>
<script>
var myaudio = document.querySelector(".myaudio");
var btnimg = document.querySelector(".btnimg");
var inpbtn = document.querySelector(".inpbtn");
var input = document.querySelector("input");
var isgo = 0;
function biggen() {
if (isgo == 0) {
myaudio.play();
btnimg.src = "./image/666.gif";
isgo = 1;
} else {
myaudio.pause();
btnimg.src = "./image/mypic.gif";
isgo = 0;
}
}
function inpbtnc() {
var name = input.value;
if (name == "") {
alert("请输入名称");
return;
}
var musicname =
HTML——表白特效.rar （15个子文件） 
HTML——表白特效 
demo.html 8KB js 
script.js 7KB TweenMax.min.js 113KB jquery.min.js 92KB snow.js 101KB css t.css 5KB iconfont.css 2KB image 
mypic.gif 47KB
snow.png 3KB img 
4.jpg 145KB 3.jpg 129KB 6.jpg 143KB 1.jpg 339KB 2.jpg 403KB 5.jpg 204KB资源评论
evildoer_max2022-07-21大家别上当，真值不到这个价 #毫无价值
lzn8112022-11-14这个资源对我启发很大，受益匪浅，学到了很多，谢谢分享~
weixin_442886202022-05-25用户下载后在一定时间内未进行评价，系统默认好评。- qq_428396792023-04-14这个资源内容超赞，对我来说很有价值，很实用，感谢大佬分享~
追光者♂
- 粉丝: 2w+
- 资源: 527
最新资源
- 基于S7-200 PLC的饮料灌装机控制系统详解：梯形图程序、接线图与IO配置全解析,基于S7-200 PLC饮料灌装机控制系统 带解释的梯形图程序，接线图原理图图纸，io分配，组态画面 ,基于S7
- jetty-javadoc-9.0.3-8.el7.x64-86.rpm.tar.gz
- 基于三菱PLC和MCGS的全方位音乐喷泉控制系统详解：梯形图程序、接线图与组态画面全解析,基于三菱PLC和MCGS组态音乐喷泉控制系统 带解释的梯形图程序，接线图原理图图纸，io分配，组态画面 ,核心
- jetty-jmx-9.0.3-8.el7.x64-86.rpm.tar.gz
- jetty-jndi-9.0.3-8.el7.x64-86.rpm.tar.gz
- 基于欧姆龙PLC的音乐喷泉精准控制系统设计：涵盖电气控制、梯形图程序、接线图与组态画面,基于欧姆龙PLC的花样喷泉控制系统设计喷泉电气控制设计音乐喷泉 带解释的梯形图程序，接线图原理图图纸，io分配
- "探究ABB变频器功率部分维修原理图：深入解析与操作指南",ABB变频器维修原理图 仅有功率部分，不含主板 ,核心关键词：ABB变频器；维修原理图；功率部分；不含主板；维修方法 ,"ABB变频
- jetty-jsp-9.0.3-8.el7.x64-86.rpm.tar.gz
- jetty-jspc-maven-plugin-9.0.3-8.el7.x64-86.rpm.tar.gz
- 发那科全系列系统调试维修手册：涵盖参数设定、编程操作、梯形图详解及手册大全,发那科0系统调试维修 0-M系统 0-T系统调试维修 0系统资料大全 参数 维修 编程操作 梯形图 等等手册 ,关键词：发
- jetty-maven-plugin-9.0.3-8.el7.x64-86.rpm.tar.gz
- jetty-monitor-9.0.3-8.el7.x64-86.rpm.tar.gz
- 基于TSN和802.1AS标准的纯逻辑时间同步系统：支持PTP v2 PTP over TSN仿真与文档详述,TSN 802.1AS 1588 时间同步 纯逻辑实现时间同步，支持1588，gpt
- jetty-parent-19-8.el7.x64-86.rpm.tar.gz
- 基于Matlab的通信信号调制识别数据集生成与性能分析代码，自动生成数据集、打标签、绘制训练策略与样本数量对比曲线，支持多种信号参数自定义与瑞利衰落信道模拟 ,通信信号调制识别所用数据集生成代码 Ma
- jetty-plus-9.0.3-8.el7.x64-86.rpm.tar.gz
资源上传下载、课程学习等过程中有任何疑问或建议，欢迎提出宝贵意见哦~我们会及时处理！
点击此处反馈
