搜索到
22
篇与
源码代码
相关的结果
-
JavaScript罗盘时钟 {tabs}{tabs-pane label="样式一"}<!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> <style> * { margin: 0; padding: 0; } html,body { width: 100%; height: 100%; background-color: #000; overflow: hidden; } #clock { position: relative; width: 100%; height: 100%; background: black; } .label { position: absolute; top: 50%; left: 50%; display: inline-block; color: #4d4d4d; text-align: center; padding: 0 5px; font-size: 19px; transition: all 1s; transform: translate(-50%,-50%); transform-origin: 0% 0%; } .now { color: #fff; } </style> </head> <body> <div id="clock"></div> <script> var yearText=[''];var monthText=[];var dayText=[];var weekText=["星期日"]; var hourText=[];var minuteText=[];var secondsText=[]; for(var i=1;i<=12;i++){monthText.push(numberToChinese(i)+"月");} for(var i=1;i<=31;i++){dayText.push(numberToChinese(i)+"号");} for(var i=1;i<= 6;i++){weekText.push("星期"+numberToChinese(i));} for(var i=0;i<=23;i++){hourText.push(numberToChinese(i)+"点");} for(var i=0;i<=59;i++){minuteText.push(numberToChinese(i)+"分");} for(var i=1;i<=60;i++){secondsText.push(numberToChinese(i)+"秒");} console.log(monthText);console.log(dayText);console.log(weekText); console.log(hourText);console.log(minuteText);console.log(secondsText); var clock;var yearList=[];var monthList=[];var dayList=[]; var weekList=[];var hourList=[];var minuteList=[];var secondsList=[]; var textList=[[yearText,yearList],[monthText,monthList],[dayText,dayList], [weekText,weekList],[hourText,hourList],[minuteText,minuteList],[secondsText,secondsList],] window.onload=function(){init(); setTimeout(function(){initTransition();},0); setTimeout(function(){var timeArr=[0,0,0,0,0,0,0];rotateTransition(timeArr); setInterval(function(){runtime()},1000)},1000)}; function init(){ clock=document.querySelector('#clock'); for (var i in textList){ for (var j in textList[i][0]){ var temp=createLabel(textList[i][0][j]); clock.appendChild(temp);textList[i][1].push(temp);}}console.log(textList);} function createLabel(text){ var div=document.createElement('div');div.classList.add('label');div.innerText=text;return div;} function runtime(){ var now=new Date();var month=now.getMonth();var day=now.getDate(); var week=now.getDay();var hour=now.getHours();var minute=now.getMinutes(); var seconds=now.getSeconds(); var timeArr=[0,month,day - 1,week,hour,minute,seconds] console.log(timeArr);clearColor();rotateTransition(timeArr);addColor(timeArr);} function addColor(timeArr){ for (var i=1; i < timeArr.length; i++){var index=timeArr[i]; textList[i][1][index].classList.add('now')}} function clearColor(){ var now=document.querySelectorAll('.now'); now.forEach(function(item){item.classList.remove('now');})} function initTransition(){ for (var i in textList){for (var item of textList[i][1]){ item.style.transform='translate('+i * 80+'px,-50%)' item.style.transformOrigin=-(i * 80)+'px 50%';}}} function rotateTransition(timeArr){ for (var i in textList){for (var j in textList[i][1]){ var temp=textList[i][1][j];var deg=360 / textList[i][0].length * (j - timeArr[i]); temp.style.transform='translate('+i * 80+'px,-50%)'+' rotate('+deg+'deg)';}}} function numberToChinese(num){//将数字0到10转换成汉字 const chineseNums=["零","一","二","三","四","五","六","七","八","九","十"]; if (num <= 10){//特殊处理11到19以及整十的情况 return chineseNums[num]; }else if(num < 20){ return "十"+(num === 10 ? "" : chineseNums[num - 10]); }else if(num % 10 === 0){ return chineseNums[num / 10]+"十"; }else{ return chineseNums[Math.floor(num / 10)]+"十"+chineseNums[num % 10]; } } </script> </body> </html>{/tabs-pane}{tabs-pane label="样式二"}<!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> <style> @font-face { font-family:unidreamLED; src:url('./UnidreamLED.ttf') /* src:url("./UnidreamLED.ttf"); */ } body { font-size:0px; height:100%; width:100%; padding:0; margin:0; position:absolute; display:flex; justify-content:center; align-items:center; color:#cad6dd; overflow:hidden; background-color:#141929; font-family:unidreamLED; } .NowData { background-image:-webkit-linear-gradient(bottom,rgb(255 0 0),rgb(120 8 220)); background-size:100% 20px; -webkit-background-clip:text; -webkit-text-fill-color:transparent; } .yearBox { height:10vh; width:10vh; position:absolute; display:flex; font-size:16px; align-items:center; justify-content:center; border-radius:50%; transition:1s; background-image:-webkit-linear-gradient(bottom,rgb(255 0 0),rgb(120 8 220)); background-size:100% 20px; -webkit-background-clip:text; -webkit-text-fill-color:transparent; } .mounthBox { height:25vh; width:25vh; position:absolute; display:flex; align-items:center; border-radius:50%; transition:1s; } .dayBox { height:40vh; width:40vh; border-radius:50%; display:flex; align-items:center; position:absolute; transition:1s; } .hourBox { height:55vh; width:55vh; position:absolute; display:flex; align-items:center; transition:1s; border-radius:50%; } .minuteBox { height:70vh; width:70vh; position:absolute; display:flex; align-items:center; border-radius:50%; transition:1s; } .secondBox { height:85vh; width:85vh; display:flex; align-items:center; position:absolute; border-radius:50%; transition:1s; } </style> </head> <body> <div class="secondBox"></div> <div class="minuteBox"></div> <div class="hourBox"></div> <div class="dayBox"></div> <div class="mounthBox"></div> <div class="yearBox"></div> <script> let sencond = `` for (i = 0; i < 60; i++) { let onediv = `<div id = "sencond${i+1}" style="font-size: 16px;width: 100%;text-align: right;position: absolute;display: inline-block;transform: rotate(${(i-1)*-6}deg);"> ${i+1} 秒</div>` sencond = sencond + onediv } document.querySelector('.secondBox').innerHTML = sencond let minute = `` for (i = 0; i < 60; i++) { let onediv = `<div id = "minute${i+1}" style="font-size: 16px;width: 100%;text-align: right;position: absolute;display: inline-block;transform: rotate(${(i)*-6}deg);"> ${i+1} 分</div>` minute = minute + onediv } document.querySelector('.minuteBox').innerHTML = minute let hour = `` for (i = 0; i < 24; i++) { let onediv = `<div id = "hour${i+1}" style="font-size: 16px;width: 100%;text-align: right;position: absolute;display: inline-block;transform: rotate(${(i)*-15}deg);"> ${i+1} 时</div>` hour = hour + onediv } document.querySelector('.hourBox').innerHTML = hour let day = `` for (i = 0; i < 31; i++) { let onediv = `<div id = "day${i+1}" style="font-size: 16px;width: 100%;text-align: right;position: absolute;display: inline-block;transform: rotate(${(i)*-11.25}deg);"> ${i+1} 日</div>` day = day + onediv } document.querySelector('.dayBox').innerHTML = day let mounth = `` for (i = 0; i < 12; i++) { let onediv = `<div id = "mounth${i+1}" style="font-size: 16px;width: 100%;text-align: right;position: absolute;display: inline-block;transform: rotate(${(i)*-30}deg);"> ${i+1} 月</div>` mounth = mounth + onediv } document.querySelector('.mounthBox').innerHTML = mounth var sencond360 = 0 var Minute360 = 0 var hour360 = 0 var day360 = 0 var mounth360 = 0 var oldsencond = 0 var oldMinute = 0 var oldhour = 0 var oldday = 0 var oldmounth = 0 function transformBox() { let nowDate = new Date() let sencond = nowDate.getSeconds() let minute = nowDate.getMinutes() let hour = nowDate.getHours() let day = nowDate.getDate() let mounth = nowDate.getMonth() let year = nowDate.getFullYear() if (sencond === 0 && oldsencond !== sencond) { sencond360 = sencond360 + 1 } if (minute === 0 && oldMinute !== minute) { Minute360 = Minute360 + 1 } if (hour === 0 && oldhour !== hour) { hour360 = hour360 + 1 } if (day === 1 && oldday !== day) { day360 = day360 + 1 } if (mounth === 0 && oldmounth !== mounth) { mounth360 = mounth360 + 1 } document.querySelector('.secondBox').style.transform = `rotate(${sencond360*360 + (sencond-1)*6}deg)` document.querySelector('.minuteBox').style.transform = `rotate(${Minute360*360 + (minute-1)*6}deg)` document.querySelector('.hourBox').style.transform = `rotate(${hour360*360 + (hour-1)*15}deg)` document.querySelector('.dayBox').style.transform = `rotate(${day360*360 + (day-1)*11.25}deg)` document.querySelector('.mounthBox').style.transform = `rotate(${mounth360*360 + (mounth)*30}deg)` document.querySelector('.yearBox').innerHTML = year + ' 年' let nowDates = document.querySelectorAll('.NowData') nowDates.forEach(element => { element.classList = '' }); document.querySelector(`#sencond${sencond+1}`).classList = 'NowData' document.querySelector(`#minute${minute===0?'60':minute}`).classList = 'NowData' document.querySelector(`#hour${hour===0?'24':hour}`).classList = 'NowData' document.querySelector(`#day${day}`).classList = 'NowData' document.querySelector(`#mounth${mounth+1}`).classList = 'NowData' oldsencond = sencond oldMinute = minute oldhour = hour oldday = day oldmounth = mounth } transformBox() setInterval(() => { transformBox() }, 1000); </script> </body> </html>{/tabs-pane}{/tabs} -
PHP生成随机验证码 验证码的生成<?php // 开启session session_start(); // 生成随机验证码 $charset = '0123456789ABCDEFGHIJKLMNPQRSTUVWXYZabcvbnmasdfghjkpiuytrewq'; $randomString = ''; // 验证码长度 $length = 6; $charsetLength = strlen($charset) - 1; for ($i = 0; $i < $length; $i++) { $randomString .= $charset[random_int(0, $charsetLength)]; } // 保存验证码到session中 $_SESSION['captcha'] = $randomString; // 创建验证码图片 $image = imagecreatetruecolor(120, 40); $bgColor = imagecolorallocate($image, 255, 255, 255); $textColor = imagecolorallocate($image, 0, 0, 0); // 填充背景色 imagefilledrectangle($image, 0, 0, 120, 40, $bgColor); // 在图片上绘制验证码 imagestring($image, 5, 40, 10, $randomString, $textColor); // 发送图像头部到浏览器 header('Content-Type: image/png'); // 输出图像到浏览器 imagepng($image); // 销毁图像资源 imagedestroy($image); ?>验证码的调用<div id="popup" class="popup"> <div class="popup-inner"> <center><h3>用户注册</h3></center> <span class="button-close" onclick="closePopup()">×</span> <form id="joinForm" action="sub.php" method="POST"> <div class="form-group"> <label for="username">账号：</label> <input type="text" id="username" name="username" placeholder="请输入账号" required> </div> <div class="form-group"> <label for="userpass">密码：</label> <input type="pass" id="userpass" name="userpass" placeholder="请输密码" required> </div> <div class="form-group"> <label for="captcha">验证码：<img class="ue-image" src="yzm.php"/></label> <input type="text" id="captcha" name="captcha" placeholder="请输入验证码" required> </div> <div class="form-group"> <div class="button-group"> <button type="submit">提交</button> </div> </div> </form> </div> </div>验证码的验证<?php //开启session session_start(); if(!empty($_POST)){ $username = $_POST['username']; $userpass = $_POST['userpass']; $captcha = $_POST['captcha']; if (!preg_match('/^[A-Za-z0-9]+$/', $captcha)) { //判断验证码的合法性，如果验证码未按0-9和a-Z的规则输入则提示验证码不正确并返回首页。 echo '<script>alert("验证码不正确！"); window.location.href = "index.php";</script>'; exit; } if($captcha!=$_SESSION['captcha']){ //判断输入的验证码是否与生成的验证码一致，如果不一致则提示验证码不正确并返回首页。 echo '<script>alert("验证码不正确！"); window.location.href = "index.php";</script>'; exit; }else{ //如果验证码正确，则继续执行代码 } } ?>
-
PHP随机输出一张图片 <?php // 图片存放的目录路径 $imagesDir = 'path/to/your/images'; /// 获取所有jpg, jpeg, gif, png图片文件 $images = glob($imageDirectory . '/*.{jpg,jpeg,gif,png}', GLOB_BRACE); // 检查是否有找到图片 if (count($images) > 0) { // 随机选择一个图片 $image = array_rand($images); // 输出图片头信息 header('Content-Type: image/jpeg'); // 输出图片文件 readfile($images[$image]); } else { // 没有找到图片的处理逻辑 echo 'No images found.'; } ?>
-
JS禁止F12、右键、复制、剪切、选中、开发者工具、网页另存为、浏览器缓存 禁止F12审查元素document.onkeydown = function(e) { if(e.keyCode == 123) { alert("F12审查元素已被禁用！"); return false; } if(e.ctrlKey && e.shiftKey && e.keyCode == 'I'.charCodeAt(0)) { alert("F12审查元素已被禁用！"); return false; } if(e.ctrlKey && e.shiftKey && e.keyCode == 'C'.charCodeAt(0)) { alert("F12审查元素已被禁用！"); return false; } if(e.ctrlKey && e.shiftKey && e.keyCode == 'J'.charCodeAt(0)) { alert("F12审查元素已被禁用！"); return false; } if(e.ctrlKey && e.keyCode == 'U'.charCodeAt(0)) { alert("查看源代码已被禁用！"); return false; } }禁止鼠标右键document.addEventListener('contextmenu', function (event) { event.preventDefault() })屏蔽粘贴document.getElementById('myInput').addEventListener('paste', function(e) { e.preventDefault(); alert('粘贴功能已被禁用，请手动输入内容。'); });屏蔽复制document.addEventListener('copy', function(e) { e.preventDefault(); alert('复制功能已被禁用。'); });屏蔽剪切document.addEventListener('cut', function(e) { e.preventDefault(); alert('剪切功能已被禁用。'); });屏蔽选中document.addEventListener('selectstart', function(e) { e.preventDefault(); alert('选中功能已被禁用。'); });检测开发者工具// 检测用户是否打开了开发者工具 function checkDevTools() { if (window.outerWidth - window.innerWidth > 160 || window.outerHeight - window.innerHeight > 160) { alert('请不要打开开发者工具！'); } } // 每隔一段时间检测一次 setInterval(checkDevTools, 1000);禁止另存网页// 禁止另存网页 document.addEventListener('contextmenu', function(e) { e.preventDefault(); alert('禁止另存网页！'); });禁止浏览器缓存// 禁止浏览器缓存 window.addEventListener('load', function() { // 使用时间戳作为参数，确保每次都是新的URL，从而禁止浏览器缓存 var timestamp = new Date().getTime(); var nocacheUrl = window.location.href + '?t=' + timestamp; window.location.href = nocacheUrl; });
-
PHP获取转换汇率 支持港币、新西兰元、澳大利亚元、美元、欧元、加拿大元、英镑、日元、新加坡元、瑞士法郎<?php $res = file_get_contents('https://m.cmbchina.com/api/rate/fx-rate'); $fxrate = json_decode($res, true); $data = $fxrate['body']['data']; if (!isset($data)) { echo '汇率接口异常'; } foreach ($data as $item) { if ($item['ccyNbr'] == "美元") { $dfFxrate = bcdiv($item['rtcOfr'],100,2);; break; } } // 输出结果为1美元=xx人民币 echo $dfFxrate; ?>
