first commit

2024-09-27 02:06:13 +08:00
commit 852d94fbb9
36760 changed files with 3274413 additions and 0 deletions
--- a/历届学生/18课程/class18_2/项目/上课项目/tabs/fq.html
+++ b/历届学生/18课程/class18_2/项目/上课项目/tabs/fq.html
@@ -0,0 +1,62 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Document</title>
+    <style>
+        body {
+            margin: 0;
+            padding: 0;
+        }
+        body,html{
+            width: 100%;
+            height: 100%;
+            position: relative;
+        }
+        span {
+            transition: all 1s ease;
+            user-select: none;
+        }
+    </style>
+</head>
+
+<body>
+</body>
+
+<script>
+
+    var body = document.querySelector("body"), index = 0;
+
+    body.onclick = function (event) {
+        var x = event.x, y = event.y;
+        var Text = ["富强", "民主", "文明", "和谐", "自由", "平等", "公正", "法治", "爱国", "敬业", "诚信", "友善"];
+        var span = document.createElement("span");
+        span.innerText = Text[index];
+    
+        span.style = `
+            color: hsl(${parseInt(Math.random() * 360)},100%,50%,1);
+            position: absolute;
+            opacity: 1;
+            left: ${x - 32}px;
+            top: ${y - 21}px
+        `;
+
+        body.appendChild(span);
+
+
+        setTimeout(function(){
+            span.style.top = `${y - 150}px`;
+            span.style.opacity = 0
+        },100)
+
+        setTimeout(function(){
+            body.removeChild(span)
+        },1100)
+        
+        index++;
+        index >= 12 ? index = 0 : ''
+    }
+   
+</script>
+</html>
--- a/历届学生/18课程/class18_2/项目/上课项目/tabs/index.html
+++ b/历届学生/18课程/class18_2/项目/上课项目/tabs/index.html
@@ -0,0 +1,70 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>tabs</title>
+    <style>
+        body, ul,li{
+            margin: 0;
+            padding: 0;
+            list-style: none;
+        }
+        .tabs_title {
+            overflow: hidden;
+        }
+        .tabs_title li {
+            float: left;
+            margin-right: 10px;
+        }
+        .title_active {
+            color: red;
+        }
+      
+        .tabs_content li{
+            display: none;
+        }
+        .content_active {
+            display: block !important;
+        }
+    </style>
+</head>
+<body>
+    
+    <ul class="tabs_title">
+        <li class="title_active">全部</li>
+        <li>规则</li>
+        <li>安全</li>
+        <li>论坛</li>
+    </ul>
+
+    <ul class="tabs_content">
+        <li class="content_active">全部的内容</li>
+        <li>规则的内容</li>
+        <li>安全的内容</li>
+        <li>论坛的内容</li>
+    </ul>
+
+</body>
+<script>
+
+    var TitleLi = document.querySelectorAll(".tabs_title li")
+    var ContentLi = document.querySelectorAll(".tabs_content li")
+
+    console.log(TitleLi);
+    TitleLi.forEach(function(v,index){
+        v.onmouseover = function () {
+
+            TitleLi.forEach(function(v,i){
+                v.className = ""
+                ContentLi[i].className = ""
+            })
+
+            v.className = "title_active"
+            ContentLi[index].className = "content_active"
+
+        }
+    })
+
+</script>
+</html>