BingGan
她说爱你，没说只爱你!
-
分享一个简约导航网站单页| blog.qqzzz.cn 一个简约的网站导航源码单页，直接新建index.html 把下方源码粘贴进去修改保存即可。 <!DOCTYPE html> <html lang="zh"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>导航网站 -blog.qqzzz.cn</title> <meta name="keywords" content="双虹云博客"> <meta name="description" content="双虹云博客。"> <meta name="author" content="导航网站"> <meta name="robots" content="index,follow"> <meta property="og:title" content="导航网站 - "> <meta property="og:description" content="双虹云。"> <meta property="og:type" content="website"> <link rel="icon" href="https://blog.qqzzz.cn/favicon.ico" type="image/x-icon"> <link rel="shortcut icon" href="https://blog.qqzzz.cn/favicon.ico" type="image/x-icon"> <style> /* 基础样式 */ * { margin: 0; padding: 0; box-sizing: border-box; } /* 主体样式 */ body { background: #f0f2f5; font-family: 'Microsoft YaHei', -apple-system, BlinkMacSystemFont, sans-serif; margin: 0; padding: 0; min-height: 100vh; overflow-x: hidden; position: relative; display: flex; flex-direction: column; } /* 容器样式 */ .container { max-width: 1200px; margin: 0 auto; padding: 20px; flex: 1; display: flex; flex-direction: column; align-items: center; width: 100%; } /* 主盒子样式 */ .main-box { background: white; box-shadow: 0 2px 12px rgba(0, 0, 0, 0.08); border-radius: 24px; border: 1px solid #e9ecef; width: 100%; max-width: 1000px; padding: 30px; margin: 0 auto 15px; transition: all 0.3s ease; position: relative; z-index: 2; } .main-box:hover { transform: translateY(-2px); box-shadow: 0 6px 25px rgba(0, 0, 0, 0.2); } /* 头部样式 */ .header { text-align: center; margin-bottom: 20px; padding-bottom: 15px; border-bottom: 1px solid rgba(255, 255, 255, 0.2); } .header h1 { font-size: 32px; background: linear-gradient(120deg, #2b5876 0%, #4e4376 100%); -webkit-background-clip: text; -webkit-text-fill-color: transparent; margin-bottom: 15px; } /* 提示框样式 */ .notice { background: transparent; padding: 0 25px; border-radius: 12px; margin-bottom: 15px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .notice p { color: #4facfe; font-size: 16px; line-height: 1; font-weight: bold; letter-spacing: 0.5px; margin: 0; } /* 流量卡领取样式 */ .flow-card, .flow-card-top { background: linear-gradient(120deg, #4facfe 0%, #00f2fe 100%); box-shadow: 0 3px 15px rgba(0, 0, 0, 0.1); border-radius: 12px; padding: 10px 15px; margin-bottom: 10px; text-align: center; position: relative; overflow: hidden; display: flex; justify-content: space-between; align-items: center; } .flow-card::before, .flow-card-top::before { content: ''; position: absolute; top: -10px; right: -10px; width: 80px; height: 80px; background: rgba(255, 255, 255, 0.1); border-radius: 50%; } .flow-card .text-content, .flow-card-top h3 { flex: 1; text-align: left; color: #ffffff; font-size: 16px; margin: 0; } .flow-card h2 { color: #ffffff; font-size: 18px; margin-bottom: 4px; font-weight: 600; } .flow-card p { color: rgba(255, 255, 255, 0.9); font-size: 14px; margin-bottom: 0; } .flow-card a, .flow-card-top a { display: inline-block; background: #ffffff; color: #2b5876; padding: 8px 0; border-radius: 50px; font-size: 15px; cursor: pointer; transition: all 0.3s ease; font-weight: 600; text-decoration: none; box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1); margin: 0 5px; white-space: nowrap; width: 110px; text-align: center; } /* 所有按钮统一样式 */ .flow-card .buttons a, .flow-card-top .buttons a { background: #ffffff; color: #2b5876; } .flow-card .buttons a:hover, .flow-card-top .buttons a:hover { background: #f8f9fa; transform: translateY(-2px); box-shadow: 0 6px 15px rgba(0, 0, 0, 0.2); } .flow-card .buttons, .flow-card-top .buttons { display: flex; align-items: center; justify-content: flex-end; flex-wrap: nowrap; } .flow-card a:hover, .flow-card-top a:hover { transform: translateY(-2px); box-shadow: 0 6px 15px rgba(0, 0, 0, 0.2); background: #f8f9fa; } .flow-card-top { margin-bottom: 10px; } /* 导航网格样式 */ .nav-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 25px; width: 100%; margin: 0 auto; padding: 0; } /* 导航项样式 */ .nav-item { background: hsl(230, 10%, 33%); border-radius: 12px; padding: 12px; text-align: center; box-shadow: none; transition: all 0.3s ease; min-height: 75px; position: relative; } .nav-item:hover { transform: none; background: hsl(230, 10%, 38%); } .nav-item a { text-decoration: none; color: inherit; display: block; text-align: center; } .nav-item h3 { color: #ffffff; font-size: 17px; margin-bottom: 8px; } .nav-item p { color: rgba(255, 255, 255, 0.9); font-size: 16px; margin-bottom: 4px; } .nav-item .status { position: absolute; bottom: -20px; left: 0; right: 0; color: #ff6b6b; font-size: 12px; text-align: center; font-weight: 500; } /* 底部导航样式 */ .float-nav { display: none; } @media (max-width: 768px) { body { padding-bottom: 20px; } .container { padding: 10px; } .main-box { padding: 15px; margin: 5px; } .header { margin-bottom: 15px; padding-bottom: 10px; } .nav-grid { gap: 15px; } .flow-card, .flow-card-top { padding: 12px; margin-bottom: 10px; flex-direction: column; } .flow-card .text-content, .flow-card-top h3 { text-align: center; margin-bottom: 12px; font-size: 16px; } .flow-card h2 { font-size: 16px; margin-bottom: 5px; text-align: center; } .flow-card p { font-size: 13px; text-align: center; padding: 0 5px; } .flow-card a, .flow-card-top a, .flow-card .buttons a, .flow-card-top .buttons a { padding: 7px 0; font-size: 14px; margin: 0 4px; width: 95px; text-align: center; background: #ffffff; color: #2b5876; } .flow-card .buttons, .flow-card-top .buttons { justify-content: center; width: 100%; margin-top: 5px; } .nav-item { padding: 12px; min-height: 70px; width: 100%; } .header h1 { font-size: 24px; } .notice p { font-size: 14px; } .copyright { padding: 10px 0; font-size: 12px; } } /* 版权信息样式 */ .copyright { text-align: center; padding: 15px 0; color: #6c757d; font-size: 13px; letter-spacing: 0.5px; width: 100%; max-width: 1200px; margin: 0 auto; } /* 弹窗样式 */ .modal-overlay { position: fixed; top: 0; left: 0; right: 0; bottom: 0; background: rgba(0, 0, 0, 0.4); display: flex; justify-content: center; align-items: center; z-index: 10000; } .modal { background: white; border: 1px solid #e9ecef; padding: 25px; border-radius: 15px; width: 90%; max-width: 320px; text-align: center; box-shadow: 0 4px 20px rgba(0, 0, 0, 0.2); } .modal h2 { color: #2b5876; margin-bottom: 20px; font-size: 20px; font-weight: bold; } .modal p { color: #6c757d; margin-bottom: 25px; font-size: 16px; line-height: 1.8; } .modal button { background: #ffffff; border: none; color: #2b5876; padding: 10px 40px; border-radius: 50px; font-size: 16px; cursor: pointer; transition: all 0.3s ease; font-weight: 600; letter-spacing: 0.5px; box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1); } .modal button:hover { transform: translateY(-2px); box-shadow: 0 6px 15px rgba(0, 0, 0, 0.2); background: #f8f9fa; } </style> </head> <body> <div class="container"> <div class="main-box"> <div class="header"> <h1>网址导航</h1> <div class="notice"> <p></p> </div> </div> <!-- 流量卡领取 --> <div class="flow-card"> <div class="text-content"> <h2>🎁一号店铺免费流量卡领取🎁</h2> <p>全国通用流量卡，每月仅19-39元起，80G-200GB超大流量，无限速！</p> </div> <div class="buttons"> <a href="https://172.lot-ml.com/ProductEn/Index/4e9215cbe8c3a4ba" target="_blank">立即领取</a> <a href="https://haoka.-ml.com/plugreg.html?agentid=10147" target="_blank">免费开通代理</a> </div> </div> <div class="flow-card"> <div class="text-content"> <h2>🎁二号店铺免费流量卡领取🎁</h2> <p>全国通用流量卡，每月仅19-39元起，80G-200GB超大流量，无限速！</p> </div> <div class="buttons"> <a href="https://h5.gao.com/url?value=yQKCu1743343994" target="_blank">立即领取</a> <a href="https://h5.gantanhao.com/url?value=Cgzla1743395118452" target="_blank">免费开通代理</a> </div> </div> <div class="nav-grid"> <!-- 导航项目1 --> <div class="nav-item"> <a href="javascript:void(0)" onclick="copyAndRedirect('www.baidu.cn', 'http://www.udg.cc')"> <h3>我爱代挂</h3> <p class="url">WWW.UDG.CC</p> <p class="status">全站暂停下单和续费</p> </a> </div> <!-- 导航项目2 --> <div class="nav-item"> <a href="javascript:void(0)" onclick="copyAndRedirect('www.nsss.cc', 'http://www.nsss.cc')"> <h3>我爱云代挂</h3> <p class="url">WWW.NSSS.CC</p> <p class="status">全站暂停下单和续费</p> </a> </div> <!-- 导航项目3 --> <div class="nav-item"> <a href="javascript:void(0)" onclick="copyAndRedirect('www.qqmz.cc', 'http://www.qqmz.cc')"> <h3>QQ秒赞</h3> <p>WWW.QQMZ.CC</p> </a> </div> <!-- 导航项目4 --> <div class="nav-item"> <a href="javascript:void(0)" onclick="copyAndRedirect('www.zpo.cc', 'http://www.zpo.cc')"> <h3>导航网站</h3> <p>WWW.ZPO.CC</p> </a> </div> </div> </div> </div> <div class="copyright"> Copyright © 2025 All Rights Reserved </div> <!-- 弹窗 --> <div class="modal-overlay" id="welcomeModal"> <div class="modal"> <h2>网站公告</h2> <p>QQ代挂全面停止新增和续费<br>老用户不受影响可正常操作</p> <button onclick="closeModal()">OK</button> </div> </div> <script> // 定义提示词 const NOTICE_TEXT = "请收藏本导航站防止丢失，方便下次访问！"; // 页面加载时设置提示词 window.onload = function() { // 置提示词 document.querySelector('.notice p').textContent = NOTICE_TEXT; // 查弹窗显示 checkModalDisplay(); }; // 检查弹窗显示次数 function checkModalDisplay() { // 获取当前显示次数 let modalCount = localStorage.getItem('modalDisplayCount') || 0; modalCount = parseInt(modalCount); // 如显示数小于2次，显示弹窗并增加计数 if (modalCount < 2) { document.getElementById('welcomeModal').style.display = 'flex'; localStorage.setItem('modalDisplayCount', modalCount + 1); } else { document.getElementById('welcomeModal').style.display = 'none'; } } // 关闭弹窗 function closeModal() { document.getElementById('welcomeModal').style.display = 'none'; } // 复制本到贴板并跳转 function copyAndRedirect(text, url) { // 创建临时输入框 const input = document.createElement('input'); input.value = text; document.body.appendChild(input); input.select(); document.execCommand('copy'); document.body.removeChild(input); // 跳转到目标网址 window.open(url, '_blank'); } </script> </body> </html> -
-
-
吾爱破解论坛2025年3月13日十七周年开放注册公告 Who Are We 吾爱破解论坛从2008年3月13日建立以来，陪伴众多坛友走过了17年艰辛而辉煌的风雨历程，以带领新手走入密界大门为基础，汇集了一大批爱好者在此栖息，今天我们依然不忘初心，希望起到承上启下的作用，带领爱好者们走入密界的圣殿。 开放注册时间 为了避免由开放注册带来的负面影响，我们将加强对新注册用户的管理。对于发现有马甲或者新注册用户从事违规行为的情况，我们会采取更加严格的处理措施。在您注册前，请认真阅读注册须知以及社区的总版规，以便更好地适应和享受我们的社区，具体限时开放注册时间如下： 2025年3月13日 12：00-- 14：00 和 20：00 -- 22：00 官方论坛: www.52pojie.cn -
-
-
-
使用PHP压缩打包文件成zip格式 使用PHP将文件、文件夹打包成zip压缩包。 打包单个文件: $zip = new ZipArchive(); $zip_filename = "down/".time().".zip"; // 压缩包存放路径与名称 $zip->open($zip_filename, ZIPARCHIVE::CREATE); // 打开压缩包,没有则创建 // 参数1是要压缩的文件,参数2为压缩后,在压缩包中的文件名「这里我们把 logo.png 文件压缩,压缩后的文件为 logon2.png」,如果需要的压缩后的文件跟原文件名一样 addFile() 的第二个参数可以改为 basename("img/logon2.png),也就是原文件所在的路径 $zip->addFile("img/logo.png",basename("logon2.png")); $res = $zip->close(); 打包多个文件: <?php $fileList = array( "img/1.jpg", "img/2.jpg", ); $filename = "down/img.zip"; // 压缩包存放路径与名称 $zip = new ZipArchive(); $zip->open($filename,ZipArchive::CREATE); //打开压缩包 //遍历文件 foreach($fileList as $file){ $zip->addFile($file,basename($file)); //向压缩包中添加文件 } $zip->close(); //关闭压缩包 打包某个文件夹（包含子文件夹）: <?php /** * @param $path 文件夹路径 * @param $zip zip 对象 */ function addFileToZip($path, $zip) { $handler = opendir($path); //打开当前文件夹由$path指定。 while (($filename = readdir($handler)) !== false) { if ($filename != "." && $filename != "..") { //文件夹文件名字为'.'和‘..’，不要对他们进行操作 if (is_dir($path . "/" . $filename)) { // 如果读取的某个对象是文件夹，则递归 addFileToZip($path . "/" . $filename, $zip); } else { //将文件加入zip对象 $zip->addFile($path . "/" . $filename); } } } } $zip = new ZipArchive(); $zip_filename = "down/files.zip"; // 压缩包存放路径与名称 $zip->open($zip_filename, ZIPARCHIVE::CREATE); // 打开压缩包,没有则创建 //调用函数，添加文件到压缩包中 addFileToZip("img",$zip); -
-
-
-
-
-
简单的HTML网页图片轮播自动切换!附源码！ 效果图可以看本站，我这里就上传了一张。 html部分: <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width,initial-scale=1, minimum-scale=1,maximum-scale=1,user-scalable=no" /> <!--引入CSS代码--> <link rel="stylesheet" type="text/css" href="./css/index.css"/> <!--引入Js代码--> <script src="./js/index.js"></script> <title>Js实现轮播图</title> </head> <body> <div class="lunbo"> <div class="content"> <ul id="item"> <li class="item"> <a href="#"><img src="img/pic1.jpg" ></a> </li> <li class="item"> <a href="#"><img src="img/pic2.jpg" ></a> </li> <li class="item"> <a href="#"><img src="img/pic3.jpg" ></a> </li> <li class="item"> <a href="#"><img src="img/pic4.jpg" ></a> </li> <li class="item"> <a href="#"><img src="img/pic5.jpg" ></a> </li> </ul> <div id="btn-left"><</div> <div id="btn-right">></div> <ul id="circle"> <li class="circle"></li> <li class="circle"></li> <li class="circle"></li> <li class="circle"></li> <li class="circle"></li> </ul> </div> </div> </body> </html> </html> CSS部分: *{ margin: 0; padding: 0; } a{ list-style: none; } li{ list-style: none; } .lunbo{ width: 100%; } .content{ width: 800px; height: 300px; margin: 20px auto; position: relative; } #item{ width: 100%; height: 100%; } .item{ position: absolute; opacity: 0; transition: all 1s; } .item.active{ opacity:1; } img{ width: 100%; } #btn-left{ width: 30px; height: 69px; font-size: 30px; color: white; background-color:rgba(0,0,0,0.4); line-height: 69px; padding-left:5px; z-index: 10;/*始终显示在图片的上层*/ position: absolute; left: 0; top: 50%; transform: translateY(-60%);/*使按钮向上偏移居中对齐*/ cursor: pointer; opacity: 0;/*平时隐藏*/ } .lunbo:hover #btn-left{ /*鼠标滑入，显示图标*/ opacity: 1; } #btn-right{ width: 26px; height: 69px; font-size: 30px; color: white; background-color:rgba(0,0,0,0.4); line-height: 69px; padding-left: 5px; z-index: 10; position: absolute; right: 0; top: 50%; cursor: pointer; opacity: 0; transform: translateY(-60%); } .lunbo:hover #btn-right{ opacity: 1; } #circle{ height: 20px; display: flex; position: absolute; bottom: 35px; right: 25px; } .circle{ width: 10px; height: 10px; border-radius: 10px; border: 2px solid white; background: rgba(0,0,0,0.4); cursor: pointer; margin: 5px; } .white{ background-color: #FFFFFF; } js部分: window.onload=function(){ var items=document.getElementsByClassName("item"); var circles=document.getElementsByClassName("circle"); var leftBtn=document.getElementById("btn-left"); var rightBtn=document.getElementById("btn-right"); var content=document.querySelector('.content'); var index=0; var timer=null; //清除class var clearclass=function(){ for(let i=0;i<items.length;i++){ items[i].className="item"; circles[i].className="circle"; circles[i].setAttribute("num",i); } } /*只显示一个class*/ function move(){ clearclass(); items[index].className="item active"; circles[index].className="circle white"; } //点击右边按钮切换下一张图片 rightBtn.onclick=function(){ if(index<items.length-1){ index++; } else{ index=0; } move(); } //点击左边按钮切换上一张图片 leftBtn.onclick=function(){ if(index<items.length){ index--; } else{ index=items.length-1; } move(); } //开始定时器，点击右边按钮，实现轮播 timer=setInterval(function(){ rightBtn.onclick(); },1500) //点击圆点时，跳转到对应图片 for(var i=0;i<circles.length;i++){ circles[i].addEventListener("click",function(){ var point_index=this.getAttribute("num"); index=point_index; move(); }) } //鼠标移入清除定时器，并开启一个三秒的定时器，使慢慢转动 content.onmouseover=function(){ clearInterval(timer); timer=setInterval(function(){ rightBtn.onclick(); },3000) } //鼠标移出又开启定时器 content.onmouseleave=function(){ clearInterval(timer); timer=setInterval(function(){ rightBtn.onclick(); },1500) } } -
记录几个免费查询归属地信息，IP地址的接口 前言: 部分是需要指定IP，查询归属地等信息；有些是直接访问获取当前客户端的IP信息。看需求使用。 另外，不确定有没有请求频率限制；当然，想要稳定最好还是去用付费的接口。 太平洋API http://whois.pconline.com.cn/ipJson.jsp? www.ip.cn https://www.ip.cn/api/index?ip&type=0 CSDN https://searchplugin.csdn.net/api/v1/ip/get?ip= ip-api.com http://ip-api.com/json/ 查询指定IP http://ip-api.com/json/123.123.123.123?lang=zh-CN www.ipplus360.com https://www.ipplus360.com/getIP api.ipify.org https://api.ipify.org/?format=json -
