首页
留言板
统计
Search
1
阿里云国际OSS使用CloudFlare免流量
2,260 阅读
2
PP.UA免费域名注册
2,169 阅读
3
Adobe Photoshop CS2经典版 中文原版
2,157 阅读
4
7-Zip中文美化版
2,026 阅读
5
获取免费的 Microsoft 365 E5 开发人员订阅
1,940 阅读
软件分享
网络资源
网络代码
生活情感
免费主机
Search
标签搜索
代码
工具软件
Android
教程
Emlog
办公软件
图形图像
免费空间
Web
情感
PHP
视频
系统工具
上传下载
Windows
建站
PDF
网盘
学习
Typecho
ZJ
累计撰写
802
篇文章
累计收到
105
条评论
首页
栏目
软件分享
网络资源
网络代码
生活情感
免费主机
页面
留言板
统计
搜索到
17
篇与
的结果
2022-09-21
为你的网站添加点击散开特效
将以下代码复制到你网站最底部即可实现<canvas id="fireworks" style="position: fixed; left: 0px; top: 0px; pointer-events: none; z-index: 2147483647; width: 1920px; height: 151px;" width="3840" height="302"></canvas> <script type="text/javascript" src="https://cdn.jsdelivr.net/npm/animejs@3.0.1/lib/anime.min.js"></script> <script type="text/javascript"> function updateCoords(e) { pointerX = (e.clientX || e.touches[0].clientX) - canvasEl.getBoundingClientRect().left, pointerY = e.clientY || e.touches[0].clientY - canvasEl.getBoundingClientRect().top } function setParticuleDirection(e) { var t = anime.random(0, 360) * Math.PI / 180, a = anime.random(50, 180), n = [-1, 1][anime.random(0, 1)] * a; return { x: e.x + n * Math.cos(t), y: e.y + n * Math.sin(t) } } function createParticule(e, t) { var a = {}; return a.x = e, a.y = t, a.color = colors[anime.random(0, colors.length - 1)], a.radius = anime.random(16, 32), a.endPos = setParticuleDirection(a), a.draw = function() { ctx.beginPath(), ctx.arc(a.x, a.y, a.radius, 0, 2 * Math.PI, !0), ctx.fillStyle = a.color, ctx.fill() }, a } function createCircle(e, t) { var a = {}; return a.x = e, a.y = t, a.color = "#F00", a.radius = .1, a.alpha = .5, a.lineWidth = 6, a.draw = function() { ctx.globalAlpha = a.alpha, ctx.beginPath(), ctx.arc(a.x, a.y, a.radius, 0, 2 * Math.PI, !0), ctx.lineWidth = a.lineWidth, ctx.strokeStyle = a.color, ctx.stroke(), ctx.globalAlpha = 1 }, a } function renderParticule(e) { for (var t = 0; t < e.animatables.length; t++) e.animatables[t].target.draw() } function animateParticules(e, t) { for (var a = createCircle(e, t), n = [], i = 0; i < numberOfParticules; i++) n.push(createParticule(e, t)); anime.timeline().add({ targets: n, x: function(e) { return e.endPos.x }, y: function(e) { return e.endPos.y }, radius: .1, duration: anime.random(1200, 1800), easing: "easeOutExpo", update: renderParticule }).add({ targets: a, radius: anime.random(80, 160), lineWidth: 0, alpha: { value: 0, easing: "linear", duration: anime.random(600, 800) }, duration: anime.random(1200, 1800), easing: "easeOutExpo", update: renderParticule, offset: 0 }) } function debounce(fn, delay) { var timer return function() { var context = this var args = arguments clearTimeout(timer) timer = setTimeout(function() { fn.apply(context, args) }, delay) } } var canvasEl = document.querySelector("#fireworks"); if (canvasEl) { var ctx = canvasEl.getContext("2d"), numberOfParticules = 30, pointerX = 0, pointerY = 0, tap = "mousedown", colors = ["#FF1461", "#18FF92", "#5A87FF", "#FBF38C"], setCanvasSize = debounce(function() { canvasEl.width = 2 * window.innerWidth, canvasEl.height = 2 * window.innerHeight, canvasEl.style.width = window.innerWidth + "px", canvasEl.style.height = window.innerHeight + "px", canvasEl.getContext("2d").scale(2, 2) }, 500), render = anime({ duration: 1 / 0, update: function() { ctx.clearRect(0, 0, canvasEl.width, canvasEl.height) } }); document.addEventListener(tap, function(e) { "sidebar" !== e.target.id && "toggle-sidebar" !== e.target.id && "A" !== e.target.nodeName && "IMG" !== e.target.nodeName && (render.play(), updateCoords(e), animateParticules(pointerX, pointerY)) }, !1), setCanvasSize(), window.addEventListener("resize", setCanvasSize, !1) } </script>
2022年09月21日
14 阅读
0 评论
0 点赞
2022-09-21
一行代码让你的博客变成灰色
通过一行代码实现全站变灰在任意css文件、style标签内加上以下属性,即可实现html { filter: grayscale(1); }Joe主题添加教程外观设置 - 全局设置 - 自定义css,填写以下内容html { filter: grayscale(1); }
2022年09月21日
24 阅读
0 评论
0 点赞
2022-09-21
Typecho实现评论显示操作系统和评论来源
首先打开 functions.php 文件,粘贴下面的代码:// 获取浏览器信息 function getBrowser($agent) { if (preg_match('/MSIE\s([^\s|;]+)/i', $agent, $regs)) { $outputer = 'Internet Explore'; } else if (preg_match('/FireFox\/([^\s]+)/i', $agent, $regs)) { $str1 = explode('Firefox/', $regs[0]); $FireFox_vern = explode('.', $str1[1]); $outputer = 'FireFox'; } else if (preg_match('/Maxthon([\d]*)\/([^\s]+)/i', $agent, $regs)) { $str1 = explode('Maxthon/', $agent); $Maxthon_vern = explode('.', $str1[1]); $outputer = 'MicroSoft Edge'; } else if (preg_match('#360([a-zA-Z0-9.]+)#i', $agent, $regs)) { $outputer = '360 Fast Browser'; } else if (preg_match('/Edge([\d]*)\/([^\s]+)/i', $agent, $regs)) { $str1 = explode('Edge/', $regs[0]); $Edge_vern = explode('.', $str1[1]); $outputer = 'MicroSoft Edge'; } else if (preg_match('/UC/i', $agent)) { $str1 = explode('rowser/', $agent); $UCBrowser_vern = explode('.', $str1[1]); $outputer = 'UC Browser'; } else if (preg_match('/QQ/i', $agent, $regs)||preg_match('/QQ Browser\/([^\s]+)/i', $agent, $regs)) { $str1 = explode('rowser/', $agent); $QQ_vern = explode('.', $str1[1]); $outputer = 'QQ Browser'; } else if (preg_match('/UBrowser/i', $agent, $regs)) { $str1 = explode('rowser/', $agent); $UCBrowser_vern = explode('.', $str1[1]); $outputer = 'UC Browser'; } else if (preg_match('/Opera[\s|\/]([^\s]+)/i', $agent, $regs)) { $outputer = 'Opera'; } else if (preg_match('/Chrome([\d]*)\/([^\s]+)/i', $agent, $regs)) { $str1 = explode('Chrome/', $agent); $chrome_vern = explode('.', $str1[1]); $outputer = 'Google Chrome'; } else if (preg_match('/safari\/([^\s]+)/i', $agent, $regs)) { $str1 = explode('Version/', $agent); $safari_vern = explode('.', $str1[1]); $outputer = 'Safari'; } else{ $outputer = 'Google Chrome'; } echo $outputer; } // 获取操作系统信息 function getOs($agent) { $os = false; if (preg_match('/win/i', $agent)) { if (preg_match('/nt 6.0/i', $agent)) { $os = 'Windows Vista · '; } else if (preg_match('/nt 6.1/i', $agent)) { $os = 'Windows 7 · '; } else if (preg_match('/nt 6.2/i', $agent)) { $os = 'Windows 8 · '; } else if(preg_match('/nt 6.3/i', $agent)) { $os = 'Windows 8.1 · '; } else if(preg_match('/nt 5.1/i', $agent)) { $os = 'Windows XP · '; } else if (preg_match('/nt 10.0/i', $agent)) { $os = 'Windows 10 · '; } else{ $os = 'Windows X64 · '; } } else if (preg_match('/android/i', $agent)) { if (preg_match('/android 9/i', $agent)) { $os = 'Android Pie · '; } else if (preg_match('/android 8/i', $agent)) { $os = 'Android Oreo · '; } else { $os = 'Android · '; } } else if (preg_match('/ubuntu/i', $agent)) { $os = 'Ubuntu · '; } else if (preg_match('/linux/i', $agent)) { $os = 'Linux · '; } else if (preg_match('/iPhone/i', $agent)) { $os = 'iPhone · '; } else if (preg_match('/mac/i', $agent)) { $os = 'MacOS · '; }else if (preg_match('/fusion/i', $agent)) { $os = 'Android · '; } else { $os = 'Linux · '; } echo $os; }comments.php 中找到合适位置(比如评论作者的后面)添加以下代码:<?php getOs($comments->agent); ?><?php getBrowser($comments->agent); ?>
2022年09月21日
23 阅读
0 评论
0 点赞
2022-09-21
Typecho安全小知识
1、开启评论来源页检查,这样如果来源不是当前网站,则会无法评论,防止利用post请求去刷评论2、评论设置里允许使用的HTML标签和属性 选项里务必不能填写 a 标签和 script标签,经测试,填写这2项标签后,可以直接评论xss执行js脚本例如 a 标签的:<a href="javascript:void(function() {$('body').remove()})()">点击删除整个网页</a>例如 script 标签的<script> window.location.href = 'https://xxx.com' </script>
2022年09月21日
27 阅读
0 评论
0 点赞
2022-09-21
Joe主题自定义搭配色教程
第一步打开主题外观设置 - 全局设置 - 自定义CSS,填写以下内容:body { --theme: #409eff; }填写完后如下图所示 第二步随便百度一个颜色网站,例如:https://www.5tu.cn/colors/yansebiao.html复制自己喜欢的颜色色彩值,例如珊瑚色:#f8aba6。接着替换掉上面填写的颜色即可,上面的代码就如下所示:body { --theme: #f8aba6; }接着保存,去前台刷新就能看见变化了,这里只是举一个栗子进行说明。到这里纯小白的教程结束,下面的内容是更加强大的全套主题色补充。完整版内容首先打开主题外观设置 - 全局设置 - 自定义CSS,填写以下内容:body { --theme: #409eff; --background: #fff; --main: #303133; --routine: #606266; --minor: #909399; --seat: #c0c4cc; --classA: #dcdfe6; --classB: #e4e7ed; --classC: #ebeef5; --classD: #f2f6fc; --radius-wrap: 8px; --radius-inner: 4px; --text-shadow: 0 1px 2px rgba(0, 0, 0, 0.25); --box-shadow: 0px 0px 20px -5px rgba(158, 158, 158, 0.22); }例如:--theme: #409eff;--theme 这个不能修改,固定的主题调用语法。--theme 冒号后面的是颜色的色彩值,这个色彩值可以用常见的颜色格式。例如 #ff6800、rgba(0,0,0,1) 等等都可以接下来对上面的每个属性做一个描述--theme顾名思义,主题色的意思,用于修改整个网站的主题色彩--background这个介绍不太好描述,用一个图形容下,比如下面这张图,他的背景色就是用的这个属性值(白色),如果想变成透明的话,可以填写 rgba 值,例如:rgba(255,255,255,0.5) 半透明--main这个是文字的颜色,颜色最深的--routine这个是文字的颜色,颜色稍微次于上面那个--minor这个是文字的颜色,颜色稍微次于上面那个--seat这个是文字的颜色,颜色稍微次于上面那个--classA这个主要用于横线、分割线用的颜色,颜色最深的--classB这个主要用于横线、分割线用的颜色,颜色稍微次于上面那个--classC这个主要用于横线、分割线用的颜色,颜色稍微次于上面那个--classD这个主要用于横线、分割线用的颜色,颜色稍微次于上面那个--radius-wrap这个主要用外层包裹的圆角度数的,如果不需要圆角,可以写0,例如--radius-inner这个主要用里层包裹的圆角度数的,如果不需要圆角,可以写0--text-shadow这个是文章标题的字体阴影,这个只在文章详情页用到,改不改区别不大--box-shadow这个是阴影,这个弄得好,网站炫酷的一批,例如拟态等都是通过这个实现的其他上面的设置都是控制主题白昼下的样式,黑夜模式的样式和这个修改方法一致
2022年09月21日
21 阅读
0 评论
0 点赞
2022-09-21
Typecho自定义后台编辑器功能
上面的增加按钮很简单,append一个li标签就可以实现,主要是在于向文本框中插入内容,以及输入键盘按键也能实现插入对应的功能。使用方法首先在你的主题 functions.php 里增加一个插件函数,这个函数的用途是在编辑文章和编辑页面里面引入自定义JSTypecho_Plugin::factory('admin/write-post.php')->bottom = array('Editor', 'edit'); Typecho_Plugin::factory('admin/write-page.php')->bottom = array('Editor', 'edit'); class Editor { public static function edit() { echo "<script src='" . Helper::options()->themeUrl . '/typecho/editor/joe.extend.js' . "'></script>"; echo "<script src='" . Helper::options()->themeUrl . '/typecho/editor/joe.editor.js' . "'></script>"; } }下面的 joe.extend.js 没压缩也没加密,下面是 joe.extend.js 源码(function ($) { $.fn.extend({ /* 按键盘实现插入内容 */ shortcuts: function () { this.keydown(function (e) { var _this = $(this); e.stopPropagation(); if (e.altKey) { switch (e.keyCode) { case 67: _this.insertContent('[code]' + _this.selectionRange() + '[/code]'); break; } } }); }, /* 插入内容 */ insertContent: function (myValue, t) { var $t = $(this)[0]; if (document.selection) { this.focus(); var sel = document.selection.createRange(); sel.text = myValue; this.focus(); sel.moveStart('character', -l); var wee = sel.text.length; if (arguments.length == 2) { var l = $t.value.length; sel.moveEnd('character', wee + t); t <= 0 ? sel.moveStart('character', wee - 2 * t - myValue.length) : sel.moveStart('character', wee - t - myValue.length); sel.select(); } } else if ($t.selectionStart || $t.selectionStart == '0') { var startPos = $t.selectionStart; var endPos = $t.selectionEnd; var scrollTop = $t.scrollTop; $t.value = $t.value.substring(0, startPos) + myValue + $t.value.substring(endPos, $t.value.length); this.focus(); $t.selectionStart = startPos + myValue.length; $t.selectionEnd = startPos + myValue.length; $t.scrollTop = scrollTop; if (arguments.length == 2) { $t.setSelectionRange(startPos - t, $t.selectionEnd + t); this.focus(); } } else { this.value += myValue; this.focus(); } }, /* 选择 */ selectionRange: function (start, end) { var str = ''; var thisSrc = this[0]; if (start === undefined) { if (/input|textarea/i.test(thisSrc.tagName) && /firefox/i.test(navigator.userAgent)) str = thisSrc.value.substring(thisSrc.selectionStart, thisSrc.selectionEnd); else if (document.selection) str = document.selection.createRange().text; else str = document.getSelection().toString(); } else { if (!/input|textarea/.test(thisSrc.tagName.toLowerCase())) return false; end === undefined && (end = start); if (thisSrc.setSelectionRange) { thisSrc.setSelectionRange(start, end); this.focus(); } else { var range = thisSrc.createTextRange(); range.move('character', start); range.moveEnd('character', end - start); range.select(); } } if (start === undefined) return str; else return this; } }); })(jQuery);上面的shortcuts方法主要用于实现按下键盘插入内容接着看 joe.edit.js的内容/* 增加自定义功能 */ const items = [ { title: '回复可见', id: 'wmd-hide-button', svg: '<svg t="1612402690962" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="15751" width="20" height="20"><path d="M554.666667 438.101333V277.333333h-85.333334v160.768L330.112 357.717333l-42.666667 73.898667L426.666667 512l-139.221334 80.384 42.666667 73.898667L469.333333 585.898667V746.666667h85.333334v-160.768l139.221333 80.384 42.666667-73.898667L597.333333 512l139.221334-80.384-42.666667-73.898667L554.666667 438.101333z" p-id="15752" fill="#9b9b9b"></path></svg>', text: '\n[@hide]这里的内容回复后才能看见[/hide]\n' } ]; items.forEach(_ => { let item = $(`<li class="wmd-button" id="${_.id}" title="${_.title}">${_.svg}</li>`); item.on('click', function () { $('#text').insertContent(_.text); }); $('#wmd-button-row').append(item); });
2022年09月21日
18 阅读
0 评论
1 点赞
2022-09-20
Typecho Joe主题的文章内容如何增加目录
概述文章目录功能是通过AutocJs来实现的,具体可以看:https://github.com/yaohaixiao/AutocJS配置步骤首先进入网站后台,点击更换外观,点击全局设置然后在下方找到 自定义增加里内容(非必填),填入下面代码<style type="text/css"> .outline-outside-modal-opened { z-index: 10000 !important; left: 0; width: 300px !important; } </style> <link rel="stylesheet" href="https://fastly.jsdelivr.net/gh/yaohaixiao/autocjs/dist/css/autoc.min.css">3.最后在自定义末尾位置内容(非必填) 中填入下面代码<script src="https://fastly.jsdelivr.net/gh/yaohaixiao/autocjs/dist/autoc.min.js"></script> <script> // 文章导航 if ( $(".joe_detail__article").length > 0 ){ // 创建 Outline 实例 let navigation = new AutocJs({ // 文章正文 DOM 节点的 ID 选择器 article: '.joe_detail__article', // 要收集的标题选择器 selector: 'h1,h2,h3,h4,h5,h6', // 侧边栏导航的标题 title: '文章导读', // 文章导读导航的位置 // outside - 以侧边栏菜单形式显示(默认值) // inside - 在文章正文一开始的地方显示 position: 'outside', // 标题图标链接的 URL 地址 // (默认)没有设置定制,点击链接页面滚动到标题位置 // 设置了链接地址,则不会滚动定位 anchorURL: '', // 链接的显示位置 // front - 在标题最前面(默认值) // back - 在标题后面 anchorAt: 'back', // 是否生成文章导读导航 isGenerateOutline: true, // 是否在文章导读导航中显示段落章节编号 isGenerateOutlineChapterCode: false, // 是否在正文的文章标题中显示段落章节编号 isGenerateHeadingChapterCode: false, // 是否在正文的文章标题中创建锚点 isGenerateHeadingAnchor: false }); } </script>
2022年09月20日
10 阅读
0 评论
0 点赞
2022-09-17
Typecho Joe主题静态文件本地化
由于默认Joe主题的静态文件是访问fastly.jsdelivr.net,将静态文件全部迁移到本地,可以加快访问速度。 把下载的静态资源复制到主题目录,然后批量修改访问地址即可。隐藏内容,请前往内页查看详情{cloud title="" type="lz" url="https://qpan.lanzouw.com/iVjky0bus7wj" password=""/}
2022年09月17日
27 阅读
0 评论
0 点赞
1
2
3