博客主页
分类

图库

下的文章

Blog:

火喵博客・日记本
没有找到内容
今天又吃了好吃的
本想去吃那个巨好吃的【香酥爆全腰】,可惜去了告诉说菜品下架了,只有一个腰花,量又少,问了服务员,说那道菜太费时间了所以下架了,以后也没有了!!!巨难受!!!第一张是今天去吃的,后面三(两)张是上次去吃的!撑死我了
【喵窝・札记】旧站今天闭站
距离上次换站点,已经过了一年半了,现在又从Hexo换到了Typecho。不得不说很是不舍。但是还好,除了评论,大部分都得到了保留。之前明明说好了赖在Hexo不走了的,但是现在还是换掉了,也许未来,还是会换到新地方的。这也应该是一定的。但是虽然换了好多站点(虽然还是模板),但好歹代表着新的开始。从前网上认识的好多可爱的人,至今陪伴着我的寥寥。但是依然陪伴着我的朋友们,感谢你们,虽然大家都鸽了很久,但是大家都没有放弃。看到谁诈尸了赶紧上前踩一踩,哈哈哈真的是很感动,很久没写句子了,有些语无伦次。 ——火喵 2021年6月 说来你们有没有人注意到,喵窝・札记中间的【・】是日文符号方形点存活时间 2020年1月5日——2021年6月9日时间统计 1年零223天(本次建站不重置,继承博客时间)总访问量 33049(不蒜子)28681(51.LA)然后是小站最后的评论,来自新伙伴 守兰 !!期望未来大家一起长久的走下去,这也是我加入十年之约的理由。然后就是截图啦!
HEXO的美化——Butterfly的美化整理
本页部分内容来自互联网,并附带转载链接;提取的内容仅仅指代本站实际使用内容,可能更换成本站主题适配的内容,仅适合本站主题使用,其他主题雷同;更多的共同内容请看原链接右下方看板娘https://blog.csdn.net/qq_36759224/article/details/85420403获取 live2d输入如下命令获取 live2d : $ npm install --save hexo-helper-live2d 输入以下命令,下载相应的模型,将 packagename 更换成模型名称即可,更多模型选择请点击此处,各个模型的预览请访问原作者的博客,或者访问这里本小站使用的是live2d-widget-model-shizuku添加如下代码打开站点目录下的 _config.yml 文件,添加如下代码:live2d: enable: true scriptFrom: local model: use: live2d-widget-model-haruto #模型选择 display: position: right #模型位置 width: 150 #模型宽度 height: 300 #模型高度 mobile: show: false #是否在手机端显示 设置好过后我们就拥有了一个卡通人物自定义鼠标指针样式选好指针样式本站使用的是奥日与黑暗森林,下载地址在这里,你也可以换成自己喜欢的指针样式应用到本博客参考过本博客主题结构,定位到\hexo\themes\butterfly\source\css\index.styl将以下代码复制到最开头 body cursor url('xxxx.cur'),default a &:hover cursor url('xxxx.cur'),pointer这样就好了~右侧小工具栏添加网易云音乐先去找网易云外链这部比较简单恕不详细说明,百度一大堆,举个例子,比如这首打上花火,播放页下侧就能找到外链的页面并取得下面的HTML代码修改主题文件首先模仿公告的样式,在hexo\themes\butterfly\layout\includes\widget多复制出来一个card_announcement.pug文件并更名将新文件中的最后一行.announcement_content= theme.announcement.content替换成网易云音乐外链,并在<iframe前加条竖线,例如这样|<iframe修改第一行和倒数第二号内容为自定义的命名...总之最后的我是这种效果...我也说不清楚惹qaq .card-widget.card-netmusic .card-content .item-headline i.fa.fa-music(aria-hidden="true") span= _p('aside.card_netmusic') |<iframe 吧啦吧啦在hexo\themes\butterfly\layout\includes\widget\index.pug中加入新的小工具列表,例如我的: if theme.aside.card_netmusic include ./card_netmusic.pug然后应该emmm没了吧,应该可以了~ps.果然忘了,在hexo\themes\butterfly\languages\zh-CN.yml和butterfly.yml的aside:里添加对应名称浏览器网页标题修改♂(欺骗)在hexo\themes\butterfly\source\js中添加crash_cheat.js填入内容(别忘了修改成自己喜欢的):<!--崩溃欺骗--> var OriginTitle = document.title; var titleTime; document.addEventListener('visibilitychange', function () { if (document.hidden) { $('[rel="icon"]').attr('href', "/joke.ico"); document.title = '!!这里这里 ◕ ں ◕ '; clearTimeout(titleTime); } else { $('[rel="icon"]').attr('href', "/favicon.ico"); document.title = '(ฅ>ω<*ฅ) 喵喵爱你哟~' + OriginTitle; titleTime = setTimeout(function () { document.title = OriginTitle; }, 2000); } });然后在hexo\themes\butterfly\layout\includes\layout.pug文件中添加如下代码: script(type='text/javascript', src='/js/crash_cheat.js')雪花背景特效雪花特效有两种,使用方法雷同上一个浏览器标题欺骗,在hexo\themes\butterfly\source\js中建立snow.js 文件,粘贴以下代码: (function($){ $.fn.snow = function(options){ var $flake = $('<div id="snowbox" />').css({'position': 'absolute','z-index':'9999', 'top': '-50px'}).html('&#10052;'), documentHeight = $(document).height(), documentWidth = $(document).width(), defaults = { minSize : 10, maxSize : 20, newOn : 1000, flakeColor : "#AFDAEF" }, options = $.extend({}, defaults, options); var interval= setInterval( function(){ var startPositionLeft = Math.random() * documentWidth - 100, startOpacity = 0.5 + Math.random(), sizeFlake = options.minSize + Math.random() * options.maxSize, endPositionTop = documentHeight - 200, endPositionLeft = startPositionLeft - 500 + Math.random() * 500, durationFall = documentHeight * 10 + Math.random() * 5000; $flake.clone().appendTo('body').css({ left: startPositionLeft, opacity: startOpacity, 'font-size': sizeFlake, color: options.flakeColor }).animate({ top: endPositionTop, left: endPositionLeft, opacity: 0.2 },durationFall,'linear',function(){ $(this).remove() }); }, options.newOn); }; })(jQuery); $(function(){ $.fn.snow({ minSize: 5, maxSize: 50, newOn: 300 }); }); 或者 function snowFall(snow) { snow = snow || {}; this.maxFlake = snow.maxFlake || 200; this.flakeSize = snow.flakeSize || 10; this.fallSpeed = snow.fallSpeed || 1; } requestAnimationFrame = window.requestAnimationFrame || window.mozRequestAnimationFrame || window.webkitRequestAnimationFrame || window.msRequestAnimationFrame || window.oRequestAnimationFrame || function(callback) { setTimeout(callback, 1000 / 60); }; cancelAnimationFrame = window.cancelAnimationFrame || window.mozCancelAnimationFrame || window.webkitCancelAnimationFrame || window.msCancelAnimationFrame || window.oCancelAnimationFrame; snowFall.prototype.start = function(){ snowCanvas.apply(this); createFlakes.apply(this); drawSnow.apply(this) } function snowCanvas() { var snowcanvas = document.createElement("canvas"); snowcanvas.id = "snowfall"; snowcanvas.width = window.innerWidth; snowcanvas.height = document.body.clientHeight; snowcanvas.setAttribute("style", "position:absolute; top: 0; left: 0; z-index: 1; pointer-events: none;"); document.getElementsByTagName("body")[0].appendChild(snowcanvas); this.canvas = snowcanvas; this.ctx = snowcanvas.getContext("2d"); window.onresize = function() { snowcanvas.width = window.innerWidth; } } function flakeMove(canvasWidth, canvasHeight, flakeSize, fallSpeed) { this.x = Math.floor(Math.random() * canvasWidth); this.y = Math.floor(Math.random() * canvasHeight); this.size = Math.random() * flakeSize + 2; this.maxSize = flakeSize; this.speed = Math.random() * 1 + fallSpeed; this.fallSpeed = fallSpeed; this.velY = this.speed; this.velX = 0; this.stepSize = Math.random() / 30; this.step = 0 } flakeMove.prototype.update = function() { var x = this.x, y = this.y; this.velX *= 0.98; if (this.velY <= this.speed) { this.velY = this.speed } this.velX += Math.cos(this.step += .05) * this.stepSize; this.y += this.velY; this.x += this.velX; if (this.x >= canvas.width || this.x <= 0 || this.y >= canvas.height || this.y <= 0) { this.reset(canvas.width, canvas.height) } }; flakeMove.prototype.reset = function(width, height) { this.x = Math.floor(Math.random() * width); this.y = 0; this.size = Math.random() * this.maxSize + 2; this.speed = Math.random() * 1 + this.fallSpeed; this.velY = this.speed; this.velX = 0; }; // 渲染雪花-随机形状(此处可修改雪花颜色!!!) flakeMove.prototype.render = function(ctx) { var snowFlake = ctx.createRadialGradient(this.x, this.y, 0, this.x, this.y, this.size); snowFlake.addColorStop(0, "rgba(255, 255, 255, 0.9)"); snowFlake.addColorStop(.5, "rgba(255, 255, 255, 0.5)"); snowFlake.addColorStop(1, "rgba(255, 255, 255, 0)"); ctx.save(); ctx.fillStyle = snowFlake; ctx.beginPath(); ctx.arc(this.x, this.y, this.size, 0, Math.PI * 2); ctx.fill(); ctx.restore(); }; function createFlakes() { var maxFlake = this.maxFlake, flakes = this.flakes = [], canvas = this.canvas; for (var i = 0; i < maxFlake; i++) { flakes.push(new flakeMove(canvas.width, canvas.height, this.flakeSize, this.fallSpeed)) } } function drawSnow() { var maxFlake = this.maxFlake, flakes = this.flakes; ctx = this.ctx, canvas = this.canvas, that = this; ctx.clearRect(0, 0, canvas.width, canvas.height); for (var e = 0; e < maxFlake; e++) { flakes[e].update(); flakes[e].render(ctx); } this.loop = requestAnimationFrame(function() { drawSnow.apply(that); }); } var snow = new snowFall({maxFlake:60}); snow.start(); 然后在hexo\themes\butterfly\layout\includes\layout.pug文件里引用即可:<!-- 雪花特效 --> <script type="text/javascript" src="\js\snow.js"></script>如果没效果,请确认网页是否已载入JQurey,如果没有请在下雪代码之前引入JQ即可:<script type="text/javascript" src="http://libs.baidu.com/jquery/1.8.3/jquery.js"></script> <script type="text/javascript" src="http://libs.baidu.com/jquery/1.8.3/jquery.min.js"></script>樱花背景特效https://yremp.live/sakura-js/因雪花特效有点问题,打算换成樱花特效。在雪花特效处直接换成樱花特效的Jsdelivr缓存即可。网站底部设置已运行时间在主题设置中找到个性化页脚内容设置框,或者在footer.php代码中添加如下代码即可: 网站已运行:<span id="run_time" style="color: black;"></span> <script> function runTime() { var d = new Date(), str = ''; BirthDay = new Date("2018-12-31"); today = new Date(); timeold = (today.getTime() - BirthDay.getTime()); sectimeold = timeold / 1000 secondsold = Math.floor(sectimeold); msPerDay = 24 * 60 * 60 * 1000 msPerYear = 365 * 24 * 60 * 60 * 1000 e_daysold = timeold / msPerDay e_yearsold = timeold / msPerYear daysold = Math.floor(e_daysold); yearsold = Math.floor(e_yearsold); //str = yearsold + "年"; str += daysold + "天"; str += d.getHours() + '时'; str += d.getMinutes() + '分'; str += d.getSeconds() + '秒'; return str; } setInterval(function () { $('#run_time').html(runTime()) }, 1000); </script>本小站使用的是这个:<!-- 网站运行时间的设置 --> <span id="timeDate">载入天数...</span> <span id="times">载入时分秒...</span> <script> var now = new Date(); function createtime() { var grt= new Date("03/09/2019 13:14:21"); now.setTime(now.getTime()+250); days = (now - grt ) / 1000 / 60 / 60 / 24; dnum = Math.floor(days); hours = (now - grt ) / 1000 / 60 / 60 - (24 * dnum); hnum = Math.floor(hours); if(String(hnum).length ==1 ){hnum = "0" + hnum;} minutes = (now - grt ) / 1000 /60 - (24 * 60 * dnum) - (60 * hnum); mnum = Math.floor(minutes); if(String(mnum).length ==1 ){mnum = "0" + mnum;} seconds = (now - grt ) / 1000 - (24 * 60 * 60 * dnum) - (60 * 60 * hnum) - (60 * mnum); snum = Math.round(seconds); if(String(snum).length ==1 ){snum = "0" + snum;} document.getElementById("timeDate").innerHTML = "本站已安全运行 "+dnum+" 天 "; document.getElementById("times").innerHTML = hnum + " 小时 " + mnum + " 分 " + snum + " 秒"; } setInterval("createtime()",250); </script>右键菜单美化在主题设置中加入如下js:var options = {items:[ {header: '欢迎做客 喵窝・札记'}, {divider: true}, {text: '↜&nbsp;&nbsp;回到首页', href: 'https://dorcandy.cn'}, {text: '↷&nbsp;&nbsp;刷新页面', onclick: function() {alert("功能添加中,先请手动是用F5或者ctrl+F5刷新页面")}}, {divider: true}, {text: '☍&nbsp;&nbsp;友情链接', href: '/link/'}, {text: '✓&nbsp;&nbsp;留言板', href: '/guestbook/'}, {text: 'ฅ&nbsp;&nbsp;关于火喵', href: '/about/'}, {divider: true}, {text: '☇&nbsp;&nbsp;百度搜索', ======}, {text: '☄&nbsp;&nbsp;更多...', onclick: function() {alert("噗qaq,更完善的右键菜单 火喵 正在努力攻克中...")}} ]} $('body').contextify(options);引入js<script src="https://cdn.bootcss.com/jquery/1.8.3/jquery.min.js" type="text/javascript"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-contextify/1.0.8/jquery.contextify.min.js"></script>还要引入bootstrap.min.css,但是需要做适量修改。主页头图上升气泡效果在butterfly中的cdn-use—>js里添加一行即可:- https://cdn.jsdelivr.net/gh/sunchaser-lilu/sunchaser-cdn@master/js/circleMagic.min.js引入steam游戏展示小工具代码如下:<iframe src="https://store.steampowered.com/widget/{%APPID%}/" frameborder="0" width="100%" height=190"></iframe>代码中的APPID可查询SteamDB效果如下:关于背景样式的修改自动更换随机背景butterfly.yml里的background:可以直接填写api接口,这里推荐使用岁月小筑大佬提供的API,实现背景自动更换,效果如下:https://img.xjh.me/random_img.php?type=bg&ctype=nature&return=302实现背景重复平铺butterfly.yml里的background:修改成素材图片地址css\_global\index.styl→#web_bg内最后两行 background-size: cover background-repeat: no-repeat修改为 background-size: 400px //cover // background-repeat: no-repeat400px为自定义尺寸实现独立页面无侧边栏定位到hexo\themes\butterfly\layout\page.pug仿照在else处加上注释之间的内容 //...................... else if page.type === 'nosidebar' article#page h1= page.title .article-container!= page.content //else...................... 在想要设置无侧边栏的页面,上方加上type: "nosidebar"完成,其中nosidebar可以换自己喜欢的名字,具体效果参照我的关于页
新方法!RSS方式呈现“新闻早报”(功能可扩展)
前言今天翻博客,无意中找到了一篇“简单而完整的 PHP RSS 阅读器”。尝试之后大为惊喜。这个短短的20行代码也正好是最近在找的,立刻就在首页添加了用此方法写来的“178动漫新闻”的侧边栏,效果非常不错,于是尝试了一下制作新一版的新闻早报,此方法使用了简单的RSS引用方式,不必再受api资源的限制,而且可扩展性也非常强,在此也分享给大家为何选用rss方式更加比api具有优势呢?rss订阅源丰富,更新节奏快,api更新不稳定,我之前的方法就经常中午才更新,这还能叫早报么api大部分都有调用次数显示,比如上一篇 JOE主题首页显示新闻早报API,可每日更新(功能可扩展) 中使用的ALAPI,每日仅1000次调用次数rss的源不仅仅是新闻,更加丰富的订阅来源,而api也就那几种了。emmm还有啥效果图新闻页创建和上次的方法一样,我们也是创建一个单独的页面来作为新闻页。从\usr\themes\Joe复制出一份page.php,并在头部添加<?php ?>寻找到<?php $this->need('public/article.php'); ?> <?php $this->need('public/handle.php'); ?>在这两行代码之间,添加 - 隐藏内容 - 其中第二行就是我们选择的rss订阅地址,这里火喵选的是奇客Solidot–传递最新科技情报,当然你也可以换成别的,比如文章最后推荐的几个源,你也可以百度。在后台新建页面,模板选择新闻2,地址栏可以填写diarynews2,然后发布查看效果。如果感觉标题多余,可以删除代码中的 <h1 style="text-align:center;"> 火喵科技新闻报 </h1>或者<?php $this->need('public/batten2.php'); ?>我这里删除了前者。设置首页文章流(可选)为了使新闻看起来更加自然方便,我们在首页添加新闻,使其看起来和文章浑然一体,此方法仅限joe7.x主题修改index.php,Ctrl+F查找<div class="joe_index__list" data-wow="<?php $this->options->JList_Animate() ?>">在此代码上方位置粘贴如下代码 - 隐藏内容 - 记得相应修改代码中的页面地址。注意事项修改前记得备份图片可以换成自己的图跳转错误记得修改成自己的内页链接,你可能需要将/dailynews2.html改成/index.php/dailynews2.htmlRSS源推荐如果你还不清楚去哪找RSS源 https://www.zhihu.com/question/19580096如果你想找更多的源 https://docs.rsshub.app/奇客Solidot https://www.solidot.org/index.rss36氪 https://36kr.com/feed月光博客 https://www.williamlong.info/rss.xml火喵博客 https://cat.dorcandy.cn/feed中国新闻网 https://www.chinanews.com.cn/rss/index.shtml
利用element显示Notification通知,复制提醒,禁用F12或右键菜单提醒
前言之前博客默认的是Qmsg,虽然很简单但是不容易看到,因此全站都换成了Notification通知。今天刚改好就被朋友催,因为很简单就记一下作为备忘了,具体效果可见图,本博客也用的这个方法,可查看实际效果。引用cdn资源<!-- 引入VUE --> <script src="https://cdn.jsdelivr.net/npm/vue@2.6.14/dist/vue.min.js"></script> <!-- 引入样式 --> <script src="https://cdn.jsdelivr.net/npm/element-ui@2.15.6/lib/index.js"></script> <!-- 引入组件库 --> <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/element-ui@2.15.6/packages/theme-chalk/lib/index.css">代码放在头部(比如header.php)就可以了代码复制提醒在任意引用全局js的文件内添加: - 隐藏内容 - 禁用右键菜单并提醒在任意引用全局js的文件内添加: - 隐藏内容 - 禁用F12按键并提醒在任意引用全局js的文件内添加: - 隐藏内容 - 相关扩展禁用左键选择//禁用左键选择 document.onselectstart = function () { return false; }禁用复制//禁用复制 document.oncopy = function () { return false; }禁用Ctrl+Shift+I//禁用Ctrl+Shift+I if ((event.ctrlKey) && (event.shiftKey) && (event.keyCode == 73)) { return false; }
辽ICP备2021005644号-1 辽公网安备 21021102000984号 萌ICP备20210005号 本站已运行 2 年 159 天 16 小时 16 分 自豪地使用 typecho 建站,并使用 MyDiary 主题 百度统计 Copyright © 2009 ~ 2022. 火喵博客 All rights reserved.
历史足迹
分类目录
  • 日常
  • 🤣 晒物
  • 🦙 代码
  • 🏗️ 建站
  • 📷 生活
  • 📭 撰稿