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

7
历届学生/刘合群/2019-07-25/back.php Normal file
View File

@@ -0,0 +1,7 @@
<?php
header("Access-Control-Allow-Origin: *");
$url = "http://v.juhe.cn/toutiao/index?key=ae8dd0002b4d7df3f68d6c7de40d322e&type=";
$type = $_GET['class'];
$url = $url.$type;
echo $data = file_get_contents($url);
?>

10
历届学生/刘合群/2019-07-25/css/clear.css Normal file
View File

@@ -0,0 +1,10 @@
body,ul,li,p,h2,h3,h1,h4,h5,h6{
margin: 0;
padding: 0;
}
li {
list-style: none;
}
a {
text-decoration: none;
}

81
历届学生/刘合群/2019-07-25/css/index.css Normal file
View File

@@ -0,0 +1,81 @@
.header {
position: fixed;
width: 100%;
}
.header_logo {
display: flex;
width: 100%;
height: 44px;
background: #d43d3d;
align-items: center;
justify-content: space-between;
}
.header_logo .icon{
font-size: 27px;
color: #fff;
margin-left: 12px;
}
.header_logo p{
color: #fff;
font-size: 19px;
width: 60%;
}
.header_menu {
width: 100%;
overflow-x: scroll;
background: #fff;
}
.header_menu ul{
display: flex;
width: 111%;
justify-content: space-around;
height: 40px;
align-items: center;
border-bottom: 1px solid #e0e0e0;
}
.content {
padding-top: 85px;
}
.header_menu ul li{
}
.list-item {
display: flex;
justify-content: space-around;
padding: 0 10px;
align-items: center;
height: 116px;
}
.list-item .item-text h3,
.list-item-two .item-text h3{
font-size: 17px;
margin-bottom: 10px;
font-weight: initial;
}
.list-item .item-text p,
.list-item-two p{
margin-bottom: 10px;
color: #999;
font-size: 12px;
}
.list-item-two{
padding: 0 10px;
}
.list-item img,
.img-list img {
height: 91.5px;
}
.list-item-two .img-list {
overflow: hidden;
}
.img-list img {
float: left;
width: 33% !important;
}
.active {
color: #d43d3d;
}

0
历届学生/刘合群/2019-07-25/css/public.css Normal file
View File

47
历届学生/刘合群/2019-07-25/index.html Normal file
View File

@@ -0,0 +1,47 @@
<!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>Document</title>
<link rel="stylesheet" href="./css/clear.css">
<link rel="stylesheet" href="./css/public.css">
<link rel="stylesheet" href="./css/index.css">
<script src="http://at.alicdn.com/t/font_1315522_dadxsoxq0vs.js"></script>
<style>
.icon {
width: 1em;
height: 1em;
vertical-align: -0.15em;
fill: currentColor;
overflow: hidden;
}
</style>
</head>
<body>
<div class="header">
<div class="header_logo">
<svg class="icon" aria-hidden="true">
<use xlink:href="#icon-profile"></use>
</svg>
<p>今日趣闻</p>
</div>
<div class="header_menu">
<ul>
</ul>
</div>
</div>
<div class="content">
</div>
</body>
<script src="./js/util.js"></script>
<script src="./js/index.js"></script>
</html>

99
历届学生/刘合群/2019-07-25/js/index.js Normal file
View File

@@ -0,0 +1,99 @@
// 形成独立作用于
(function () {
// 顶部导航菜单
var headerMenu = [
{ title: '头条', type: 'top' },
{ title: '社会', type: 'shehui' },
{ title: '国内', type: 'guoji' },
{ title: '娱乐', type: 'yule' },
{ title: '体育', type: 'tiyu' },
{ title: '军事', type: 'junshi' },
{ title: '科技', type: 'keji' },
{ title: '财经', type: 'caijing' },
{ title: '时尚', type: 'shishang' }
];
// ajax 获取数据 type 分类的拼音名
function GetData(type) {
ajax({
data: {
type: type
},
success: function (res) {
RenderList(res.result.data)
}
})
}
/**
* 根据你传递过来的数据，帮你渲染新闻列表页面
* @param {*} list
*/
function RenderList (list) {
document.querySelector(".content").innerHTML = ""
list.forEach(function(val){
// 如果是两张图和三张图的情况统一使用三张图的html布局
if(val.hasOwnProperty("thumbnail_pic_s02")) {
document.querySelector(".content").innerHTML +=`
<div class="list-item-two">
<div class="item-text">
<h3>${val.title}</h3>
</div>
<div class="img-list">
<img src="${val.thumbnail_pic_s}">
<img src="${val.thumbnail_pic_s02}">
${val.hasOwnProperty("thumbnail_pic_s03") ? `<img src="${val.thumbnail_pic_s03}">` : ''}
</div>
<p>${val.author_name} ${val.category} ${val.date}</p>
</div>
`
// 一张图的布局
} else {
document.querySelector(".content").innerHTML +=`
<div class="list-item">
<div class="item-text">
<h3>${val.title}</h3>
<p>${val.author_name} ${val.category} ${val.date}</p>
</div>
<img src="${val.thumbnail_pic_s}" alt="${val.title}">
</div>`
}
})
}
/**
* 渲染顶部横向的菜单
*/
function RenderMenu () {
headerMenu.forEach(function(val,index){
document.querySelector(".header_menu ul").innerHTML += `
<li class="${index == 0 ? 'active': ''}">${val.title}</li>
`
})
}
/**
* 菜单被点击的时候切换激活样式，并请求对应数据。
*/
function changeMenu() {
var MenuLi = document.querySelectorAll(".header_menu ul li");
MenuLi.forEach(function(val,index){
val.onclick = function () {
MenuLi.forEach(function(vas){
vas.className = ""
})
GetData(headerMenu[index].type)
val.className = "active"
}
})
}
RenderMenu()
changeMenu()
GetData('top')
})()

14
历届学生/刘合群/2019-07-25/js/util.js Normal file
View File

@@ -0,0 +1,14 @@
function ajax(params) {
var http = new XMLHttpRequest();
http.open("GET",`http://127.0.0.1/back.php?class=${params.data.type}`)
http.send()
http.onreadystatechange = function () {
if(http.readyState == 4 && http.status == 200){
params.success(JSON.parse(http.response))
}
}
}