[关闭]
@huangdanning 2021-07-08T15:51:39.000000Z 字数 8702 阅读 418

博客个性化设置记录2021、7、8

blog

一 footer

顶端

  1.                 <!-- 粒子时钟 -->
  3.             <div style="">
  4.               <canvas id="canvas" style="width:60%;">当前浏览器不支持canvas，请更换浏览器后再试</canvas>
  5.             </div>
  6.             <script>
  7.             (function(){
  9.                var digit=
  10.                 [
  11.                     [
  12.                         [0,0,1,1,1,0,0],
  13.                         [0,1,1,0,1,1,0],
  14.                         [1,1,0,0,0,1,1],
  15.                         [1,1,0,0,0,1,1],
  16.                         [1,1,0,0,0,1,1],
  17.                         [1,1,0,0,0,1,1],
  18.                         [1,1,0,0,0,1,1],
  19.                         [1,1,0,0,0,1,1],
  20.                         [0,1,1,0,1,1,0],
  21.                         [0,0,1,1,1,0,0]
  22.                     ],//0
  23.                     [
  24.                         [0,0,0,1,1,0,0],
  25.                         [0,1,1,1,1,0,0],
  26.                         [0,0,0,1,1,0,0],
  27.                         [0,0,0,1,1,0,0],
  28.                         [0,0,0,1,1,0,0],
  29.                         [0,0,0,1,1,0,0],
  30.                         [0,0,0,1,1,0,0],
  31.                         [0,0,0,1,1,0,0],
  32.                         [0,0,0,1,1,0,0],
  33.                         [1,1,1,1,1,1,1]
  34.                     ],//1
  35.                     [
  36.                         [0,1,1,1,1,1,0],
  37.                         [1,1,0,0,0,1,1],
  38.                         [0,0,0,0,0,1,1],
  39.                         [0,0,0,0,1,1,0],
  40.                         [0,0,0,1,1,0,0],
  41.                         [0,0,1,1,0,0,0],
  42.                         [0,1,1,0,0,0,0],
  43.                         [1,1,0,0,0,0,0],
  44.                         [1,1,0,0,0,1,1],
  45.                         [1,1,1,1,1,1,1]
  46.                     ],//2
  47.                     [
  48.                         [1,1,1,1,1,1,1],
  49.                         [0,0,0,0,0,1,1],
  50.                         [0,0,0,0,1,1,0],
  51.                         [0,0,0,1,1,0,0],
  52.                         [0,0,1,1,1,0,0],
  53.                         [0,0,0,0,1,1,0],
  54.                         [0,0,0,0,0,1,1],
  55.                         [0,0,0,0,0,1,1],
  56.                         [1,1,0,0,0,1,1],
  57.                         [0,1,1,1,1,1,0]
  58.                     ],//3
  59.                     [
  60.                         [0,0,0,0,1,1,0],
  61.                         [0,0,0,1,1,1,0],
  62.                         [0,0,1,1,1,1,0],
  63.                         [0,1,1,0,1,1,0],
  64.                         [1,1,0,0,1,1,0],
  65.                         [1,1,1,1,1,1,1],
  66.                         [0,0,0,0,1,1,0],
  67.                         [0,0,0,0,1,1,0],
  68.                         [0,0,0,0,1,1,0],
  69.                         [0,0,0,1,1,1,1]
  70.                     ],//4
  71.                     [
  72.                         [1,1,1,1,1,1,1],
  73.                         [1,1,0,0,0,0,0],
  74.                         [1,1,0,0,0,0,0],
  75.                         [1,1,1,1,1,1,0],
  76.                         [0,0,0,0,0,1,1],
  77.                         [0,0,0,0,0,1,1],
  78.                         [0,0,0,0,0,1,1],
  79.                         [0,0,0,0,0,1,1],
  80.                         [1,1,0,0,0,1,1],
  81.                         [0,1,1,1,1,1,0]
  82.                     ],//5
  83.                     [
  84.                         [0,0,0,0,1,1,0],
  85.                         [0,0,1,1,0,0,0],
  86.                         [0,1,1,0,0,0,0],
  87.                         [1,1,0,0,0,0,0],
  88.                         [1,1,0,1,1,1,0],
  89.                         [1,1,0,0,0,1,1],
  90.                         [1,1,0,0,0,1,1],
  91.                         [1,1,0,0,0,1,1],
  92.                         [1,1,0,0,0,1,1],
  93.                         [0,1,1,1,1,1,0]
  94.                     ],//6
  95.                     [
  96.                         [1,1,1,1,1,1,1],
  97.                         [1,1,0,0,0,1,1],
  98.                         [0,0,0,0,1,1,0],
  99.                         [0,0,0,0,1,1,0],
  100.                         [0,0,0,1,1,0,0],
  101.                         [0,0,0,1,1,0,0],
  102.                         [0,0,1,1,0,0,0],
  103.                         [0,0,1,1,0,0,0],
  104.                         [0,0,1,1,0,0,0],
  105.                         [0,0,1,1,0,0,0]
  106.                     ],//7
  107.                     [
  108.                         [0,1,1,1,1,1,0],
  109.                         [1,1,0,0,0,1,1],
  110.                         [1,1,0,0,0,1,1],
  111.                         [1,1,0,0,0,1,1],
  112.                         [0,1,1,1,1,1,0],
  113.                         [1,1,0,0,0,1,1],
  114.                         [1,1,0,0,0,1,1],
  115.                         [1,1,0,0,0,1,1],
  116.                         [1,1,0,0,0,1,1],
  117.                         [0,1,1,1,1,1,0]
  118.                     ],//8
  119.                     [
  120.                         [0,1,1,1,1,1,0],
  121.                         [1,1,0,0,0,1,1],
  122.                         [1,1,0,0,0,1,1],
  123.                         [1,1,0,0,0,1,1],
  124.                         [0,1,1,1,0,1,1],
  125.                         [0,0,0,0,0,1,1],
  126.                         [0,0,0,0,0,1,1],
  127.                         [0,0,0,0,1,1,0],
  128.                         [0,0,0,1,1,0,0],
  129.                         [0,1,1,0,0,0,0]
  130.                     ],//9
  131.                     [
  132.                         [0,0,0,0,0,0,0],
  133.                         [0,0,1,1,1,0,0],
  134.                         [0,0,1,1,1,0,0],
  135.                         [0,0,1,1,1,0,0],
  136.                         [0,0,0,0,0,0,0],
  137.                         [0,0,0,0,0,0,0],
  138.                         [0,0,1,1,1,0,0],
  139.                         [0,0,1,1,1,0,0],
  140.                         [0,0,1,1,1,0,0],
  141.                         [0,0,0,0,0,0,0]
  142.                     ]//:
  143.                 ];
  145.             var canvas = document.getElementById('canvas');
  147.             if(canvas.getContext){
  148.                 var cxt = canvas.getContext('2d');
  149.                 //声明canvas的宽高
  150.                 var H = 25,W = 700;
  151.                 canvas.height = H;
  152.                 canvas.width = W;
  153.                 cxt.fillStyle = '#f00';
  154.                 cxt.fillRect(10,10,50,50);
  156.                 //存储时间数据
  157.                 var data = [];
  158.                 //存储运动的小球
  159.                 var balls = [];
  160.                 //设置粒子半径
  161.                 var R = canvas.height/20-1;
  162.                 (function(){
  163.                     var temp = /(\d)(\d):(\d)(\d):(\d)(\d)/.exec(new Date());
  164.                     //存储时间数字，由十位小时、个位小时、冒号、十位分钟、个位分钟、冒号、十位秒钟、个位秒钟这7个数字组成
  165.                     data.push(temp[1],temp[2],10,temp[3],temp[4],10,temp[5],temp[6]);
  166.                 })();
  168.                 /*生成点阵数字*/
  169.                 function renderDigit(index,num){
  170.                     for(var i = 0; i < digit[num].length; i++){
  171.                         for(var j = 0; j < digit[num][i].length; j++){
  172.                             if(digit[num][i][j] == 1){
  173.                                 cxt.beginPath();
  174.                                 cxt.arc(14*(R+2)*index + j*2*(R+1)+(R+1),i*2*(R+1)+(R+1),R,0,2*Math.PI);
  175.                                 cxt.closePath();
  176.                                 cxt.fill();
  177.                             }
  178.                         }
  179.                     }
  180.                 }
  182.                 /*更新时钟*/
  183.                 function updateDigitTime(){
  184.                     var changeNumArray = [];
  185.                     var temp = /(\d)(\d):(\d)(\d):(\d)(\d)/.exec(new Date());
  186.                     var NewData = [];
  187.                     NewData.push(temp[1],temp[2],10,temp[3],temp[4],10,temp[5],temp[6]);
  188.                     for(var i = data.length-1; i >=0 ; i--){
  189.                         //时间发生变化
  190.                         if(NewData[i] !== data[i]){
  191.                             //将变化的数字值和在data数组中的索引存储在changeNumArray数组中
  192.                             changeNumArray.push(i+'_'+(Number(data[i])+1)%10);
  193.                         }
  194.                     }
  195.                     //增加小球
  196.                     for(var i = 0; i< changeNumArray.length; i++){
  197.                         addBalls.apply(this,changeNumArray[i].split('_'));
  198.                     }
  199.                     data = NewData.concat();
  200.                 }
  202.                 /*更新小球状态*/
  203.                 function updateBalls(){
  204.                     for(var i = 0; i < balls.length; i++){
  205.                         balls[i].stepY += balls[i].disY;
  206.                         balls[i].x += balls[i].stepX;
  207.                         balls[i].y += balls[i].stepY;
  208.                         if(balls[i].x > W + R || balls[i].y > H + R){
  209.                             balls.splice(i,1);
  210.                             i--;
  211.                         }
  212.                     }
  213.                 }
  215.                 /*增加要运动的小球*/
  216.                 function addBalls(index,num){
  217.                     var numArray = [1,2,3];
  218.                     var colorArray =  ["#3BE","#09C","#A6C","#93C","#9C0","#690","#FB3","#F80","#F44","#C00"];
  219.                     for(var i = 0; i < digit[num].length; i++){
  220.                         for(var j = 0; j < digit[num][i].length; j++){
  221.                             if(digit[num][i][j] == 1){
  222.                                 var ball = {
  223.                                     x:14*(R+2)*index + j*2*(R+1)+(R+1),
  224.                                     y:i*2*(R+1)+(R+1),
  225.                                     stepX:Math.floor(Math.random() * 4 -2),
  226.                                     stepY:-2*numArray[Math.floor(Math.random()*numArray.length)],
  227.                                     color:colorArray[Math.floor(Math.random()*colorArray.length)],
  228.                                     disY:1
  229.                                 };
  230.                                 balls.push(ball);
  231.                             }
  232.                         }
  233.                     }
  234.                 }
  236.                 /*渲染*/
  237.                 function render(){
  238.                     //重置画布宽度，达到清空画布的效果
  239.                     canvas.height = 100;
  240.                     //渲染时钟
  241.                     for(var i = 0; i < data.length; i++){
  242.                         renderDigit(i,data[i]);
  243.                     }
  244.                     //渲染小球
  245.                     for(var i = 0; i < balls.length; i++){
  246.                         cxt.beginPath();
  247.                         cxt.arc(balls[i].x,balls[i].y,R,0,2*Math.PI);
  248.                         cxt.fillStyle = balls[i].color;
  249.                         cxt.closePath();
  250.                         cxt.fill();
  251.                     }
  252.                 }
  254.                 clearInterval(oTimer);
  255.                 var oTimer = setInterval(function(){
  256.                     //更新时钟
  257.                     updateDigitTime();
  258.                     //更新小球状态
  259.                     updateBalls();
  260.                     //渲染
  261.                     render();
  262.                 },50);
  263.             }
  265.             })();
  266.             </script>
  268.         <!-- 粒子时钟 -->   
  269. <!--一言-->
  270.         <div class="sidebar-box">
  271.             <div class="p-4">一言·Hitokoto</div>
  272.             <script type="text/javascript" src="https://chuxjian.asia/hitokoto/?format=js&charset=utf-8"></script>
  273.             <div class="hitokoto"><script>hitokoto()</script></div>
  274.         </div>
  275. <!-- 开往-友链接力  -->
  276. <a href="https://travellings.link/" target="_blank" rel="noopener" title="开往-友链接力">
  277.     <img src="https://cdn.jsdelivr.net/gh/volfclub/travellings@12.0/assets/logo.gif" alt="开往-友链接力" width="120">
  278. </a>
  280. <!-- 点击出现小心心 -->
  281. <script>
  282.     (function(window,document,undefined){
  283. var hearts = [];
  284. window.requestAnimationFrame = (function(){
  285. return window.requestAnimationFrame ||
  286. window.webkitRequestAnimationFrame ||
  287. window.mozRequestAnimationFrame ||
  288. window.oRequestAnimationFrame ||
  289. window.msRequestAnimationFrame ||
  290. function (callback){
  291. setTimeout(callback,1000/60);
  292. }
  293. })();
  294. init();
  295. function init(){
  296. css(".heart{width: 10px;height: 10px;position: fixed;background: #f00;transform: rotate(45deg);-webkit-transform: rotate(45deg);-moz-transform: rotate(45deg);}.heart:after,.heart:before{content: '';width: inherit;height: inherit;background: inherit;border-radius: 50%;-webkit-border-radius: 50%;-moz-border-radius: 50%;position: absolute;}.heart:after{top: -5px;}.heart:before{left: -5px;}");
  297. attachEvent();
  298. gameloop();
  299. }
  300. function gameloop(){
  301. for(var i=0;i<hearts.length;i++){
  302. if(hearts[i].alpha <=0){
  303. document.body.removeChild(hearts[i].el);
  304. hearts.splice(i,1);
  305. continue;
  306. }
  307. hearts[i].y--;
  308. hearts[i].scale += 0.004;
  309. hearts[i].alpha -= 0.013;
  310. hearts[i].el.style.cssText = "left:"+hearts[i].x+"px;top:"+hearts[i].y+"px;opacity:"+hearts[i].alpha+";transform:scale("+hearts[i].scale+","+hearts[i].scale+") rotate(45deg);background:"+hearts[i].color;
  311. }
  312. requestAnimationFrame(gameloop);
  313. }
  314. function attachEvent(){
  315. var old = typeof window.onclick==="function" && window.onclick;
  316. window.onclick = function(event){
  317. old && old();
  318. createHeart(event);
  319. }
  320. }
  321. function createHeart(event){
  322. var d = document.createElement("div");
  323. d.className = "heart";
  324. hearts.push({
  325. el : d,
  326. x : event.clientX - 5,
  327. y : event.clientY - 5,
  328. scale : 1,
  329. alpha : 1,
  330. color : randomColor()
  331. });
  332. document.body.appendChild(d);
  333. }
  334. function css(css){
  335. var style = document.createElement("style");
  336. style.type="text/css";
  337. try{
  338. style.appendChild(document.createTextNode(css));
  339. }catch(ex){
  340. style.styleSheet.cssText = css;
  341. }
  342. document.getElementsByTagName('head')[0].appendChild(style);
  343. }
  344. function randomColor(){
  345. return "rgb("+(~~(Math.random()*255))+","+(~~(Math.random()*255))+","+(~~(Math.random()*255))+")";
  346. }
  347. })(window,document);
  348. </script>

版权前

  1. <!-- 运行计时 --> 
  2. <span id="timeDate">载入天数...</span><span id="times">载入时分秒...</span>
  3. <script>
  4.     var now = new Date(); 
  5.     function createtime() { 
  6.         var grt= new Date("07/06/2021 09:38:00");//在此处修改你的建站时间
  7.         now.setTime(now.getTime()+250); 
  8.         days = (now - grt ) / 1000 / 60 / 60 / 24; dnum = Math.floor(days); 
  9.         hours = (now - grt ) / 1000 / 60 / 60 - (24 * dnum); hnum = Math.floor(hours); 
  10.         if(String(hnum).length ==1 ){hnum = "0" + hnum;} minutes = (now - grt ) / 1000 /60 - (24 * 60 * dnum) - (60 * hnum); 
  11.         mnum = Math.floor(minutes); if(String(mnum).length ==1 ){mnum = "0" + mnum;} 
  12.         seconds = (now - grt ) / 1000 - (24 * 60 * 60 * dnum) - (60 * 60 * hnum) - (60 * mnum); 
  13.         snum = Math.round(seconds); if(String(snum).length ==1 ){snum = "0" + snum;} 
  14.         document.getElementById("timeDate").innerHTML = "初x见已陪伴大家🧡"+dnum+" 天 "; 
  15.         document.getElementById("times").innerHTML = hnum + " 小时 " + mnum + " 分 " + snum + " 秒"; 
  16.     } 
  17. setInterval("createtime()",250);
  18. </script>

二 sidebar

最新回复上方

  1.                 <!-- 开往-友链接力  -->
  2.         &nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp&nbsp
  3.         <a href="https://travellings.link/" target="_blank" rel="noopener" title="开往-友链接力">
  4.             <img src="https://cdn.jsdelivr.net/gh/volfclub/travellings@12.0/assets/logo.gif" alt="开往-友链接力" width="120">
  5.         </a>
  6.         <br> </br>
  8.         <div class="sidebar-box">
  9.             <div class="p-4">我🌞们</div>
  10.             <span id="runtime_span">网站已在风雨中运行:267天23小时45分40秒</span><script type="text/javascript">function show_runtime(){window.setTimeout("show_runtime()",1000);X=new Date("12/16/2019 10:52:50");Y=new Date();T=(Y.getTime()-X.getTime());M=24*60*60*1000;a=T/M;A=Math.floor(a);b=(a-A)*24;B=Math.floor(b);c=(b-B)*60;C=Math.floor((b-B)*60);D=Math.floor((c-C)*60);runtime_span.innerHTML="&nbsp&nbsp&nbsp我们已经在风雨中相爱💝"+A+"天"}show_runtime();</script>
  11.         </div>

三 主题配置

f11d5377c655cfa9ddba6dab0e940a1a
https://pic.imgdb.cn/item/5f4752b1160a154a674f4644.png 站点图标

✈ 注册/登录
💏 我们の小站

https://pic.imgdb.cn/item/5f4a305b160a154a670eff27.jpg 顶部大图 590px
https://pic.imgdb.cn/item/5f47528b160a154a674f3cb1.jpg 侧边栏头像
本文章版权皆属于作者H_Daniel。转载时请备注原出处及作者，谢谢您的关注及支持！ 声明

https://cdn.jsdelivr.net/gh/zwying0814/Cuteen@4.5/static/ CDN

body{cursor:url(https://pic.imgdb.cn/item/5f475371160a154a674f77ec.png),default;}
a:hover{cursor:url(https://pic.imgdb.cn/item/5f475387160a154a674f7ce1.png),pointer;}
//光标

添加新批注
在作者公开此批注前，只有你和作者可见。
回复批注