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

148
历届学生/逯帅帅/项目开发/学生项目/谢文军/demo1/page/demo.html Normal file
View File

@@ -0,0 +1,148 @@
<!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>tabs切换</title>
<style>
html,
body,
div,
ul,
li,
h1,
h2,
h3,
h4,
h5,
h6,
p,
dl,
dt,
dd,
ol,
form,
input,
textarea,
th,
td,
select {
margin: 0;
padding: 0;
list-style: none;
}
.title {
height: 45px;
display: flex;
align-items: center;
justify-content: space-around;
}
.show_title{
color: red;
}
.content li{
display: none;
}
.show_content{
display: inline-block !important;
}
</style>
</head>
<body>
<div class="tabs">
<ul class="title">
</ul>
<ul class="content">
</ul>
</div>
</body>
<script>
var title = document.querySelector(".title");
var content = document.querySelector(".content");
var tabs = [
{
title: '推荐',
list: [
{
title : '推荐的内容1',
time: '2021-03-05'
},
{
title : '推荐的内容2',
time: '2021-03-05'
}
]
},
{
title: '游戏',
list: [
{
title : '游戏的内容1',
time: '2021-03-05'
},
{
title : '游戏的内容2',
time: '2021-03-05'
}
]
},
{
title: '热点',
list: [
{
title : '热点的内容1',
time: '2021-03-05'
},
{
title : '热点的内容2',
time: '2021-03-05'
}
]
}
];
function CreateTitle(){
tabs.forEach(function(v,i){
title.innerHTML += `<li class="${ i==0?'show_title':'' }">${v.title}</li>`
});
}
function CreateContent(){
tabs.forEach(function(v,i){
content.innerHTML += `<li class="${i==0?'show_content':''}">${v.list.map(function(item){
return `<span>${item.title}</span>`
}).toString().replace(/,/g,"")
}</li>`
})
}
function clickTabs(){
var Title_li = document.querySelectorAll(".title li")
var Content_li = document.querySelectorAll(".content li")
console.log("Title_li,Content_li",Title_li,Content_li);
Title_li.forEach(function(a,b){
console.log("aaaa",a);
a.onclick = function(){
Title_li.forEach(function(k,j){
k.classList.remove("show_title")
Content_li[j].classList.remove("show_content")
})
a.classList.add("show_title")
Content_li[b].classList.add("show_content")
}
})
}
CreateTitle();
CreateContent();
clickTabs();
</script>
</html>

24
历届学生/逯帅帅/项目开发/学生项目/谢文军/demo1/page/demo2.html Normal file
View File

@@ -0,0 +1,24 @@
<!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>
<style>
body,html{
height: 100%;
}
</style>
</head>
<body></body>
<script>
var index = 0;
var body = document.querySelector("body")
body.onclick = function(event){
var X = event.x,
Y = event.y;
}
</script>
</html>

135
历届学生/逯帅帅/项目开发/学生项目/谢文军/demo1/page/earth.html Normal file
View File

@@ -0,0 +1,135 @@
<!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>旋转地球</title>
<style>
body{ height:768px; overflow:hidden; background-color:#000}
#sun{ width:2000px; height:2000px; background-image:url(images/dc4.png); background-size:100% 100%; position:absolute; right:-1400px; top:-1000px;
border-radius:1000px;
box-shadow:0 0 200px #F30,
0 0 20px #F00,
0 0 10px #FF0,
0 0 200px #F30;
animation-name:bbb;
animation-duration:360s;
animation-iteration-count:infinite;
animation-timing-function:linear}
#box{
width:400px;
height:400px;
position:absolute;
top:300px;
left:300px;
border-radius:200px;
/*transform-style:preserve-3d;
transform:rotateX(70deg);*/
transform:rotate(-15deg);
overflow:hidden;
box-shadow:0 0 30px #00F,
0 0 30px #00F;
}
#shadow{
width:400px;
height:400px;
border-radius:200px;
position:absolute;
z-index:999;
box-shadow:0px 0 80px black inset,
60px 0 60px black inset;
}
#img{
width:2400px;
height:400px;
position:absolute;
left:-800px;
background-image:url(images/mapa.jpg);
border-radius:200px;
animation-name:aaa;
animation-duration:10s;
animation-iteration-count:infinite;
animation-timing-function:linear
}
#div1{
width:400px;
height:400px;
border-radius:200px;
position:absolute;
background:-webkit-gradient(radial,330 200,10,330 200,80,from(#FFF),to(blue));
opacity:0.3;
/*transform-style:preserve-3d;
transform:translateX(400px);*/
/*animation-name:aaa;
animation-duration:5s;
animation-iteration-count:infinite;
animation-timing-function:linear;*/
}
@keyframes ccc{
0%{
background-position:-80px 0px;
}
50%{
background-position:0px -80px;
}
100%{
background-position:-80px 0px;
}
}
@keyframes bbb{
0%{
transform:rotate(0deg);
}
100%{
transform:rotate(360deg);
}
}
@keyframes aaa{
0%{
left:-2000px;
}
100%{
left:-800px;
}
}
</style>
<script>
window.onload=function()
{
/*
var oDiv = document.getElementById("div1");
for(var i = 0;i<=180;i++)
{
var aImg = document.createElement("img");
aImg.src="cir.svg";
aImg.style.transformStyle="preserve-3d";
aImg.style.position="absolute";
aImg.style.transform="rotateX("+i+"deg)";
oDiv.appendChild(aImg);
}
*/
}
</script>
</head>
<body>
<div id="sun"></div>
<div id="box">
<div id="shadow"></div>
<div id="img"></div>
<div id="div1">
</div>
</div>
<div></div>
</body>
</html>

358
历届学生/逯帅帅/项目开发/学生项目/谢文军/demo1/page/elema.html Normal file
View File

@@ -0,0 +1,358 @@
<!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>饿了么</title>
<script src="../js/rem.js"></script>
<link rel="stylesheet" href="http://at.alicdn.com/t/font_2390935_17yqrqf00bk.css">
<link rel="stylesheet" href="../css/clear.css">
<link rel="stylesheet" href="../css/public.css">
<link rel="stylesheet" href="../css/elema.css">
</head>
<body>
<div class="header">
<div class="location">
<i class="iconfont icon-weizhi"></i>
<span>政务环路合肥市行政服务中心</span>
<i class="iconfont icon-zhankai"></i>
</div>
<div class="search">
<i class="iconfont icon-sousuo"></i>
<span>搜索饿了么商家、商品名称</span>
</div>
</div>
<div class="content">
<ul class="menu">
<li>
<img src="../img/jitui.png" alt="">
<p>美食</p>
</li>
<li>
<img src="../img/jitui.png" alt="">
<p>美食</p>
</li>
<li>
<img src="../img/jitui.png" alt="">
<p>美食</p>
</li>
<li>
<img src="../img/jitui.png" alt="">
<p>美食</p>
</li>
<li>
<img src="../img/jitui.png" alt="">
<p>美食</p>
</li>
<li>
<img src="../img/jitui.png" alt="">
<p>美食</p>
</li>
<li>
<img src="../img/jitui.png" alt="">
<p>美食</p>
</li>
<li>
<img src="../img/jitui.png" alt="">
<p>美食</p>
</li>
</ul>
<div class="activity padd">
<div class="activity_text">
<h3>品质套餐</h3>
<div class="des">搭配齐全吃得好</div>
<div class="buy">立即抢购 ></div>
</div>
<img class="activity_img" src="../img/cai.png" />
</div>
<div class="shop_list">
<div class="title">推荐商家</div>
<ul class="condition">
<li>
综合排序
<i class="iconfont icon-zhankai"></i>
</li>
<li>
综合排序
</li>
<li>
综合排序
</li>
<li>
综合
<i class="iconfont icon-zhankai"></i>
</li>
</ul>
<ul class="list padd">
<li>
<img class="shop_logo" src="../img/shaokao.png" alt="">
<div class="list_text">
<div class="list_text_title">
<h3>R&B珍奶会所(大唐国际店)</h3>
<i class="iconfont icon-zhankai"></i>
</div>
<div class="zan">
<img src="../img/zan.svg" alt="">
<span>4.7&nbsp;月售2679单</span>
</div>
<div class="peisong">
<div class="left">
¥15起送 | 配送¥0.5
</div>
<div class="right">
253m | 30分钟
</div>
</div>
<ul class="tag">
<li>奶茶果汁</li>
<li>奶茶果汁</li>
<li>奶茶果汁</li>
</ul>
<ul class="youhui">
<li>
<div class="sss">
<div class="tip">减</div>
<div class="youhui_text">满16元减1元，满26元减2元，满36元减4元，满46元减8元</div>
</div>
<div class="youhui_icon">
<span>4个活动</span>
<i class="iconfont icon-zhankai"></i>
</div>
</li>
<li>
<div class="sss">
<div class="tip">减</div>
<div class="youhui_text">满16元减1元，满26元减2元，满36元减4元，满46元减8元</div>
</div>
<div class="youhui_icon">
<span>4个活动</span>
<i class="iconfont icon-zhankai"></i>
</div>
</li>
</ul>
</div>
</li>
<li>
<img class="shop_logo" src="../img/shaokao.png" alt="">
<div class="list_text">
<div class="list_text_title">
<h3>R&B珍奶会所(大唐国际店)</h3>
<i class="iconfont icon-zhankai"></i>
</div>
<div class="zan">
<img src="../img/zan.svg" alt="">
<span>4.7&nbsp;月售2679单</span>
</div>
<div class="peisong">
<div class="left">
¥15起送 | 配送¥0.5
</div>
<div class="right">
253m | 30分钟
</div>
</div>
<ul class="tag">
<li>奶茶果汁</li>
<li>奶茶果汁</li>
<li>奶茶果汁</li>
</ul>
<ul class="youhui">
<li>
<div class="sss">
<div class="tip">减</div>
<div class="youhui_text">满16元减1元，满26元减2元，满36元减4元，满46元减8元</div>
</div>
<div class="youhui_icon">
<span>4个活动</span>
<i class="iconfont icon-zhankai"></i>
</div>
</li>
<li>
<div class="sss">
<div class="tip">减</div>
<div class="youhui_text">满16元减1元，满26元减2元，满36元减4元，满46元减8元</div>
</div>
<div class="youhui_icon">
<span>4个活动</span>
<i class="iconfont icon-zhankai"></i>
</div>
</li>
</ul>
</div>
</li>
<li>
<img class="shop_logo" src="../img/shaokao.png" alt="">
<div class="list_text">
<div class="list_text_title">
<h3>R&B珍奶会所(大唐国际店)</h3>
<i class="iconfont icon-zhankai"></i>
</div>
<div class="zan">
<img src="../img/zan.svg" alt="">
<span>4.7&nbsp;月售2679单</span>
</div>
<div class="peisong">
<div class="left">
¥15起送 | 配送¥0.5
</div>
<div class="right">
253m | 30分钟
</div>
</div>
<ul class="tag">
<li>奶茶果汁</li>
<li>奶茶果汁</li>
<li>奶茶果汁</li>
</ul>
<ul class="youhui">
<li>
<div class="sss">
<div class="tip">减</div>
<div class="youhui_text">满16元减1元，满26元减2元，满36元减4元，满46元减8元</div>
</div>
<div class="youhui_icon">
<span>4个活动</span>
<i class="iconfont icon-zhankai"></i>
</div>
</li>
<li>
<div class="sss">
<div class="tip">减</div>
<div class="youhui_text">满16元减1元，满26元减2元，满36元减4元，满46元减8元</div>
</div>
<div class="youhui_icon">
<span>4个活动</span>
<i class="iconfont icon-zhankai"></i>
</div>
</li>
</ul>
</div>
</li>
<li>
<img class="shop_logo" src="../img/shaokao.png" alt="">
<div class="list_text">
<div class="list_text_title">
<h3>R&B珍奶会所(大唐国际店)</h3>
<i class="iconfont icon-zhankai"></i>
</div>
<div class="zan">
<img src="../img/zan.svg" alt="">
<span>4.7&nbsp;月售2679单</span>
</div>
<div class="peisong">
<div class="left">
¥15起送 | 配送¥0.5
</div>
<div class="right">
253m | 30分钟
</div>
</div>
<ul class="tag">
<li>奶茶果汁</li>
<li>奶茶果汁</li>
<li>奶茶果汁</li>
</ul>
<ul class="youhui">
<li>
<div class="sss">
<div class="tip">减</div>
<div class="youhui_text">满16元减1元，满26元减2元，满36元减4元，满46元减8元</div>
</div>
<div class="youhui_icon">
<span>4个活动</span>
<i class="iconfont icon-zhankai"></i>
</div>
</li>
<li>
<div class="sss">
<div class="tip">减</div>
<div class="youhui_text">满16元减1元，满26元减2元，满36元减4元，满46元减8元</div>
</div>
<div class="youhui_icon">
<span>4个活动</span>
<i class="iconfont icon-zhankai"></i>
</div>
</li>
</ul>
</div>
</li>
<li>
<img class="shop_logo" src="../img/shaokao.png" alt="">
<div class="list_text">
<div class="list_text_title">
<h3>R&B珍奶会所(大唐国际店)</h3>
<i class="iconfont icon-zhankai"></i>
</div>
<div class="zan">
<img src="../img/zan.svg" alt="">
<span>4.7&nbsp;月售2679单</span>
</div>
<div class="peisong">
<div class="left">
¥15起送 | 配送¥0.5
</div>
<div class="right">
253m | 30分钟
</div>
</div>
<ul class="tag">
<li>奶茶果汁</li>
<li>奶茶果汁</li>
<li>奶茶果汁</li>
</ul>
<ul class="youhui">
<li>
<div class="sss">
<div class="tip">减</div>
<div class="youhui_text">满16元减1元，满26元减2元，满36元减4元，满46元减8元</div>
</div>
<div class="youhui_icon">
<span>4个活动</span>
<i class="iconfont icon-zhankai"></i>
</div>
</li>
<li>
<div class="sss">
<div class="tip">减</div>
<div class="youhui_text">满16元减1元，满26元减2元，满36元减4元，满46元减8元</div>
</div>
<div class="youhui_icon">
<span>4个活动</span>
<i class="iconfont icon-zhankai"></i>
</div>
</li>
</ul>
</div>
</li>
</ul>
</div>
</div>
<ul class="footer">
<li>
<i class="iconfont icon-shuaxin"></i>
<span>首页</span>
</li>
<li class="active">
<i class="iconfont icon-shuaxin"></i>
<span>首页</span>
</li>
<li>
<i class="iconfont icon-shuaxin"></i>
<span>首页</span>
</li>
<li>
<i class="iconfont icon-shuaxin"></i>
<span>首页</span>
</li>
</ul>
</body>
</html>

13
历届学生/逯帅帅/项目开发/学生项目/谢文军/demo1/page/game.html Normal file
View File

@@ -0,0 +1,13 @@
<!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>game</title>
<link rel="stylesheet" href="../js/game.js">
</head>
<body>
</body>
</html>

58
历届学生/逯帅帅/项目开发/学生项目/谢文军/demo1/page/index.html Normal file
View File

@@ -0,0 +1,58 @@
<!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>demo1</title>
<script src="../js/rem.js"></script>
<link rel="stylesheet" href="http://at.alicdn.com/t/font_2390935_w3yt2wymib.css
">
<link rel="stylesheet" href="../css/clear.css">
<link rel="stylesheet" href="../css/public.css">
<link rel="stylesheet" href="../css/index.css">
</head>
<body>
<div class="header">
<i class="iconfont icon-fanhui"></i>
<span class="header_c">收入详情</span>
<span></span>
</div>
<div class="center">
<div class="center_q">
<span></span>
<span class="center_a">+￥399.00</span>
<span></span>
</div>
<ul>
<li>
<span class="center_b">流水号</span>
<span class="center_c">20181125015755</span>
</li>
<li>
<span class="center_b">付款类型</span>
<span class="center_c">充值</span>
</li>
<li>
<span class="center_b">收支类型</span>
<span class="center_c">充值</span>
</li>
<li>
<span class="center_b">支付方式</span>
<span class="center_c">微信钱包</span>
</li>
<li>
<span class="center_b">创建时间</span>
<span class="center_c">2018-11-25 21:03:03</span>
</li>
<li>
<span class="center_b">备注</span>
<span class="center_c">微信充值399.00元</span>
</li>
</ul>
</div>
</body>
</html>

37
历届学生/逯帅帅/项目开发/学生项目/谢文军/demo1/page/index2.html Normal file
View File

@@ -0,0 +1,37 @@
<!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>demo2</title>
<script src="../js/rem.js"></script>
<link rel="stylesheet" href="http://at.alicdn.com/t/font_2390935_w3yt2wymib.css">
<link rel="stylesheet" href="../css/clear.css">
<link rel="stylesheet" href="../css/public.css">
<link rel="stylesheet" href="../css/index2.css">
</head>
<body>
<div class="header">
<i class="iconfont icon-fanhui"></i>
</div>
<div class="center">
<p>
登录
</p>
<ul>
<input type="text" placeholder="请输入账号">
<input type="text" placeholder="请输入密码">
</ul>
<button>登录</button>
<div class="header_a">
<span>忘记密码?</span>
<div>
<span>没有账号？</span>
<a href="">立即注册</a>
</div>
</div>
</div>
</body>
</html>

28
历届学生/逯帅帅/项目开发/学生项目/谢文军/demo1/page/index3.html Normal file
View File

@@ -0,0 +1,28 @@
<!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>demo3</title>
<script src="../js/rem.js"></script>
<link rel="stylesheet" href="../css/clear.css">
<link rel="stylesheet" href="../css/public.css">
<link rel="stylesheet" href="../css/index3.css">
</head>
<body>
<div class="header">
<span class="header_a">取消</span>
<span class="header_b">设置备注和标签</span>
<button>确定</button>
</div>
<div class="center">
<p class="center_b">输入标签</p>
<div class="center_a">
<p class="center_c">所有标签</p>
<button>同事</button>
</div>
</div>
</body>
</html>

139
历届学生/逯帅帅/项目开发/学生项目/谢文军/demo1/page/index4.html Normal file
View File

@@ -0,0 +1,139 @@
<!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>demo4</title>
<script src="../js/rem.js"></script>
<link rel="stylesheet" href="http://at.alicdn.com/t/font_2390935_w3yt2wymib.css">
<link rel="stylesheet" href="../css/clear.css">
<link rel="stylesheet" href="../css/public.css">
<link rel="stylesheet" href="../css/index4.css">
</head>
<body>
<div class="header">
<i class="iconfont icon-fanhui"></i>
<span>全部粉丝（200）</span>
<span></span>
</div>
<div class="conter">
<ul>
<li>
<div class="conter_a">
<img src="../img/head.png" alt="">
<span>A孙先森</span>
</div>
<div class="conter_b">
<button>关注</button>
<img src="../img/three.png" alt="">
</div>
</li>
<li>
<div class="conter_a">
<img src="../img/head.png" alt="">
<span>A孙先森</span>
</div>
<div class="conter_b">
<button>已关注</button>
<img src="../img/three.png" alt="">
</div>
</li>
<li>
<div class="conter_a">
<img src="../img/head.png" alt="">
<span>A孙先森</span>
</div>
<div class="conter_b">
<button>已关注</button>
<img src="../img/three.png" alt="">
</div>
</li>
<li>
<div class="conter_a">
<img src="../img/head.png" alt="">
<span>A孙先森</span>
</div>
<div class="conter_b">
<button>已关注</button>
<img src="../img/three.png" alt="">
</div>
</li>
<li>
<div class="conter_a">
<img src="../img/head.png" alt="">
<span>A孙先森</span>
</div>
<div class="conter_b">
<button>已关注</button>
<img src="../img/three.png" alt="">
</div>
</li>
<li>
<div class="conter_a">
<img src="../img/head.png" alt="">
<span>A孙先森</span>
</div>
<div class="conter_b">
<button>已关注</button>
<img src="../img/three.png" alt="">
</div>
</li>
<li>
<div class="conter_a">
<img src="../img/head.png" alt="">
<span>A孙先森</span>
</div>
<div class="conter_b">
<button>已关注</button>
<img src="../img/three.png" alt="">
</div>
</li>
<li>
<div class="conter_a">
<img src="../img/head.png" alt="">
<span>A孙先森</span>
</div>
<div class="conter_b">
<button>已关注</button>
<img src="../img/three.png" alt="">
</div>
</li>
<li>
<div class="conter_a">
<img src="../img/head.png" alt="">
<span>A孙先森</span>
</div>
<div class="conter_b">
<button>已关注</button>
<img src="../img/three.png" alt="">
</div>
</li>
<li>
<div class="conter_a">
<img src="../img/head.png" alt="">
<span>A孙先森</span>
</div>
<div class="conter_b">
<button>已关注</button>
<img src="../img/three.png" alt="">
</div>
</li>
<li>
<div class="conter_a">
<img src="../img/head.png" alt="">
<span>A孙先森</span>
</div>
<div class="conter_b">
<button>已关注</button>
<img src="../img/three.png" alt="">
</div>
</li>
</ul>
</div>
</body>
</html>

30
历届学生/逯帅帅/项目开发/学生项目/谢文军/demo1/page/index5.html Normal file
View File

@@ -0,0 +1,30 @@
<!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>demo5</title>
<script src="../js/rem.js"></script>
<link rel="stylesheet" href="http://at.alicdn.com/t/font_2390935_w3yt2wymib.css">
<link rel="stylesheet" href="../css/clear.css">
<link rel="stylesheet" href="../css/public.css">
<link rel="stylesheet" href="../css/index5.css">
</head>
<body>
<div class="header">
<i class="iconfont icon-fanhui"></i>
<span>拼团</span>
<span></span>
</div>
<div class="center">
<img src="../img/suo.png" alt="">
<div class="center_a">
<img src="../img/gantan.png" alt="">
<span>抱歉，该功能暂未开通！</span>
</div>
</div>
</body>
</html>

57
历届学生/逯帅帅/项目开发/学生项目/谢文军/demo1/page/richandstrong.html Normal file
View File

@@ -0,0 +1,57 @@
<!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>rich and strong</title>
<style>
body,
html {
height: 100%;
}
</style>
</head>
<body>
</body>
<script>
var index = 0;
var body = document.querySelector("body")
body.onclick = function (event) {
// console.log(event)
var x = event.x;
var Y = event.y;
var Text = ["富强", "民主", "文明", "和谐", "自由", "平等", "公正", "法治", "爱国", "敬业", "诚信", "友善"];
index > 11 ? index = 0 : '';
// console.log(Text[index])
var span = document.createElement("span");
span.innerText = Text[index];
span.style = `
position: fixed;
left: ${x}px;
top: ${Y}px;
transition: all ease 1s;
opacity: 1;
color: hsla(${parseInt(Math.random() * 360)},100%,50%);`;
body.appendChild(span)
console.log(span)
animation(span,Y);
index++
}
function animation(a,y) {
setTimeout(function (){
a.style.opacity = 0
a.style.top = `${y-100}px`
},100)
setTimeout(function (){
body.removeChild(a)
},1100)
}
</script>
</html>

41
历届学生/逯帅帅/项目开发/学生项目/谢文军/demo1/page/sousuo.html Normal file
View File

@@ -0,0 +1,41 @@
<!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>搜索</title>
</head>
<body>
<input type="text" placeholder="输入关键字">
<ul></ul>
</body>
<script>
var JyList = ['天天学习', '努力学习', '天天蹦迪', '天天吃屎', '努力向上'];
var ul = document.querySelector("ul")
var input = document.querySelector("input");
input.oninput = function () {
// console.log(input)
if (input.value.trim().length > 0) {
var newList = [];
JyList.forEach(function (v, i) {
if (v.indexOf(input.value) > -1) {
var start = v.indexOf(input.value);
var length = input.value.length;
var newStr = `<span style="color:red">${v.substr(start, length)}</span>`;
newList.push(v.replace(input.value, newStr))
}
});
ul.innerHTML = ""
newList.forEach(function (v) {
ul.innerHTML += `<li>${v}</li>`
})
} else {
ul.innerHTML = ""
}
}
</script>
</html>

85
历届学生/逯帅帅/项目开发/学生项目/谢文军/demo1/page/tabs.html Normal file
View File

@@ -0,0 +1,85 @@
<!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>tabs切换</title>
<style>
html,
body,
div,
ul,
li,
h1,
h2,
h3,
h4,
h5,
h6,
p,
dl,
dt,
dd,
ol,
form,
input,
textarea,
th,
td,
select {
margin: 0;
padding: 0;
list-style: none;
}
.title {
height: 45px;
display: flex;
align-items: center;
justify-content: space-around;
}
.show_title{
color: red;
}
.content li{
display: none;
}
.show_content{
display: inline-block !important;
}
</style>
</head>
<body>
<div class="tabs">
<ul class="title">
<li class="show_title">推荐</li>
<li>游戏</li>
<li>热点</li>
</ul>
<ul class="content">
<li class="show_content">推荐的内容</li>
<li>游戏的内容</li>
<li>热点的内容</li>
</ul>
</div>
</body>
<script>
var title = document.querySelectorAll(".title li")
var content = document.querySelectorAll(".content li")
title.forEach(function (vao,index) {
// console.log(vao)
vao.onclick = function () {
// console.log(vao)
title.forEach(function (asd,bb) {
asd.classList.remove("show_title")
content[bb].classList.remove("show_content")
})
vao.classList.add("show_title");
content[index].classList.add("show_content")
}
})
</script>
</html>

149
历届学生/逯帅帅/项目开发/学生项目/谢文军/demo1/page/tabs2.html Normal file
View File

@@ -0,0 +1,149 @@
<!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>tabs切换</title>
<style>
html,
body,
div,
ul,
li,
h1,
h2,
h3,
h4,
h5,
h6,
p,
dl,
dt,
dd,
ol,
form,
input,
textarea,
th,
td,
select {
margin: 0;
padding: 0;
list-style: none;
}
.title {
height: 45px;
display: flex;
align-items: center;
justify-content: space-around;
}
.show_title{
color: red;
}
.content li{
display: none;
}
.show_content{
display: inline-block !important;
}
</style>
</head>
<body>
<div class="tabs">
<ul class="title">
</ul>
<ul class="content">
</ul>
</div>
</body>
<script>
var title = document.querySelector(".title");
var content = document.querySelector(".content");
var tabs = [
{
title: '推荐',
list: [
{
title : '推荐的内容1',
time: '2021-03-05'
},
{
title : '推荐的内容2',
time: '2021-03-05'
}
]
},
{
title: '游戏',
list: [
{
title : '游戏的内容1',
time: '2021-03-05'
},
{
title : '游戏的内容2',
time: '2021-03-05'
}
]
},
{
title: '热点',
list: [
{
title : '热点的内容1',
time: '2021-03-05'
},
{
title : '热点的内容2',
time: '2021-03-05'
}
]
}
];
// function RenderTitle () {
// tabs.forEach(function (v,i){
// title.innerHTML += `<li class="${ i == 0 ? 'show_title' : ''}">${v.title}</li>`
// })
// }
// function RenderContent () {
// tabs.forEach(function (v,i){
// content.innerHTML += `<li class="${ i == 0 ? 'show_content' : ''}">${
// (
// v.list.map(function (item) {
// return `<p>${item.title}</p>`
// }).toString().replace(/,/g, "")
// )
// }</li>`
// })
// }
// function changeTabs() {
// var title = document.querySelectorAll(".title li")
// console.log("title",title);
// var content = document.querySelectorAll(".content li")
// title.forEach(function (vao,index) {
// // console.log(vao)
// vao.onclick = function () {
// // console.log(vao)
// title.forEach(function (asd,bb) {
// asd.classList.remove("show_title")
// content[bb].classList.remove("show_content")
// })
// vao.classList.add("show_title");
// content[index].classList.add("show_content")
// }
// })
// }
// RenderTitle();
// RenderContent();
// changeTabs()
</script>
</html>

37
历届学生/逯帅帅/项目开发/学生项目/谢文军/demo1/page/tanchuang.html Normal file
View File

@@ -0,0 +1,37 @@
<!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>弹窗</title>
<style>
.none{
width: 200px;
}
</style>
</head>
<body>
<button>登录</button>
<!-- <button onclick="baba()">登录</button> -->
</body>
<script>
var button = document.querySelector("button")
console.log(button);
// function baba(){
// alert(123)
// }
button.onclick = function () {
// console.log(button.className);
button.classList.toggle("none")
// alert('123465')
}
// button.addEventListener('click',function(){
// alert('123456')
// })
// button.addEventListener('click',function(){
// alert('1999996')
// })
</script>
</html>