Hexo NexT主题添加点击爱心效果】的更多相关文章

给NexT主题内添加页面点击出现爱心的效果 创建js文件 在/themes/next/source/js/src下新建文件clicklove.js,接着把该链接下的代码拷贝粘贴到clicklove.js文件中.代码如下: 1 !function(e,t,a){function n(){c(".heart{width: 10px;height: 10px;position: fixed;background: #f00;transform: rotate(45deg);-webkit-transf…
使用原生JS,实现鼠标点击爱心效果 !!! 引言: 在很多时候我们都需要实现鼠标点击出现图案或者文字这样的效果,对于用户而言,这样的体验是很极致的.其实实现起来也很简单,下面一起来学习一下吧.文末附上完整代码,可以复制关键部分直接使用到自己的页面上 实现效果 这样的效果很常用,在很多网页博客中都有使用 实现思路 首先我们需要获取到当前鼠标点击的位置 需要在当前位置生成一个标签 需要给标签添加随机的自定义内容 随机的文本颜色 添加文本的淡出效果 清除淡出的标签 实现过程 下面的代码为了分开解释进行…
个人博客:https://mmmmmm.me 源码:https://github.com/dataiyangu/dataiyangu.github.io 背景: 博主的博客希望实现能够在点击到某个文章的时候,跳转完了之后,页面能够自主的向下滚动到浏览的区域,因为博主的工作是搞java的,js方面在大一大二的时候搞过,有些东西忘记了,或者还没有接触到,有技术的盲区(可能对于阅读这篇文章的你来说有些可笑~),不管那么多,记录下来,以便以后维护. 上代码: function article_top()…
博客地址:往事亦如风的博客 要想先看打赏和分享功能效果,请移步我的博客 打赏功能 因为next主题自带打赏功能,所以我们只需要在next的主题配置文件中找到如下代码,image文件夹是我在blog/source下面建立的文件夹,然后把你的微信及支付宝收钱码图片拉进去,修改名字为wechatreward.png和alipayreward.png reward_comment: 坚持原创技术分享,您的支持将鼓励我继续创作! wechatpay: /image/wechatreward.png ali…
根据关键字搜索博文,站内搜索的功能很实用.hexo开启站内搜索很方便,已经有现成的插件可以使用,也是为了方便自己 安装插件 npm install hexo-generator-search --save npm install hexo-generator-searchdb --save 配置hexo站点主配置文件_config.yml,在文件末尾添加 search: path: search.xml field: post format: html limit: 10000 修改next主题…
Android在5.0版为Button默认添加了点击时的涟漪效果,而且在其他的控件上也可以轻松的实现这种炫酷的效果.涟漪效果可以分为两种,一种时有边界的涟漪,另一种时无边界的涟漪.所谓的有边界,即涟漪的效果展现不会超过控件的大小:另一种无边界效果,涟漪在越过控件边界之后还会继续扩散,然后逐渐消失. 实现涟漪效果,我们只需要在控件的android:backgroud 属性上进行设置即可.两种效果的设置如下 : 有边界的涟漪效果: android:background="?android:attr/…
title: hexo next主题为博客添加分享功能 date: 2018-01-06 20:20:02 tags: [hexo博客, 博客配置] categories: hexo next主题配置 --- 今天心血来潮,决定给博客添加分享功能,百度上首先是找到了使用shareSDK的分享功能,最后在实践的过程中发现它添加时步骤比较多,添加完成后效果比较丑(就是一个长条的浅蓝色按钮),而且点击后想要退出分享比较麻烦(它的取消按钮实在太难找了,它在页面最下方的位置,呈现浅灰色,这个设计太反人类了…
最近在优化hexo 新搭建的博客,想给博客添加一个天气插件,奈何找了很久也没发现,好不容易发现一个天气插件 心知天气:https://www.seniverse.com/widget/get 运气不好刚好赶上官方维护,我还咨询了客服 ,插件升级改版暂停新用户接入,老用户还可以继续使用,不过今天的主题不是心知, 接下里步入主题........ 在搜寻插件的过程中无意间用google搜到的一个网站,而且使用更加简单,在这里附上插件添加的方法,在这里不得不吹捧一下谷歌的强大 中国天气网:https:/…
查看效果 每日前端 我的博客 实现:1.下载这段js代码到项目目录 ===>下载地址2.在需要的地方添加js代码 <script type="text/javascript" src="js文件目录"></script> cnblog增加点击红心特效设置 ==>页脚HTML代码 ==>添加js代码到最后一行ps:有cdn的可以把js文件放到cdn,链接到cnblog,没有的直接复制js代码到cnblog设置处,如下: <…
前言 UIView 不像 UIButton 加了点击事件就会有点击效果,体验要差不少,这里分别通过自定义和扩展来实现类似 UIButton 的效果. 声明 欢迎转载,但请保留文章原始出处:) 博客园:http://www.cnblogs.com 农民伯伯: http://over140.cnblogs.com 正文 一.为 UIView 添加点击事件 extension UIView { func addOnClickListener(target: AnyObject, action: Sel…
个人博客:https://mmmmmm.me 源码:https://github.com/dataiyangu/dataiyangu.github.io 背景 hexo next主题,本人diy的时候pc端点击链接显示正常,但是移动端点击链接页面会偶尔显示偶尔不显示的情况. 解决 单单针对这个错误是不太好排查的,我们先解决看看是不是有其他的错误影响了,通过访问博客发现报错了,是关于require的timeout错误,在自己的另一个文章中解决了这个问题,https://blog.csdn.net/…
自从在 Github Page 落户以后,很长一段时间使用的是极简且有点艺术范儿的 fexo 主题,而不是大名鼎鼎的 next 主题.后来偶然发现了符合我审美的Hexo博客 maupassant 主题,准备好好经营,但是更新博客的动力不足.新的一年开始,我终于决定引入 Google Adsense ,让自己的博客显得主流一点,如果能够顺便赚些零花钱当然更好了.本文默认读者已经注册了 Adsense 账号,下面仅仅分享一下具体的设置步骤,方便自己以后备查. 从 Adsense 中下载具体广告模块代…
备注:该教程基于Hexo 2.x版本,目前Hexo是3.x版本,照本教程实现有可能会出现404错误,笔者目前还未找时间去解决,待笔者找时间解决该问题后,再写一篇该问题的解决教程,给各位读者带来困扰,还请多包涵!若有读者遇到类似的问题解决了,欢迎在文章的评论区评论留言,我们相互学习! 前情提要 几个月前,写过几篇关于Hexo博客搭建的教程,最近几天,发现有很多读者私信我一些Hexo搭建过程中遇到的问题,重新燃起了我对Hexo博客的兴趣,于是花了一两天的时间重新将Hexo博客搭建了一下,并通过配置实…
文章目录 背景: 进入正题 pjax初体验--instantclick 真正的pjax 第一步 第二步 第三步 第四步 专门基于hexo next主题的pjax(将丢失的js效果重现) 将下面讲到的提取出来 点击右边的sidebar,sidebar不出现 sidebar自动隐藏,自动显示,点击出现,点击隐藏,回到首页,回到中间等操作 添加bootstrp出现闪屏的现象 右边的sidebar鼠标滚动目录滑动事件没了 局部刷新文章不显示了,文章那里是空白的. 评论没了 局部会闪一下 阅读数没了 百度…
Hexo.主题.部署上线 安装Hexo git和nodejs安装好后,就可以安装hexo了,你可以先创建一个文件夹MyBlog,用来存放自己的博客文件,然后cd到这个文件夹下(或者在这个文件夹下直接右键git bash打开). 比如我的博客文件都存放在D:\MyBlog目录下. 在该目录下右键点击Git Bash Here,打开git的控制台窗口,以后我们所有的操作都在git控制台进行,就不用Windows自带的cmd了. npm install -g hexo-cli 安装完后输入hexo -…
博主喜欢简洁大方的Hexo主题,看了不下100个主题之后,最终选择了 landscape-plus 主题(针对中国大陆地区,对Hexo官方主题landscape进行优化后的版本).更多Hexo主题资源,可以参考帖子:有那些好看的hexo主题? 虽然 landscape-plus 整体风格我很喜欢,但有些细节方面处理得不够精致,只有自己动手改改了.如果大家还有什么好的想法,可以在评论区留言,我为大家定制修改. 原始效果 改后效果 GitHub Clone 地址 修改归档挂件的时间格式:(以下图片,…
安装部分配置hexo icarus主题配置 安装icarus 直接下载主题模块放到blog项目 ,blog项目根目录执行 git clone https://github.com/ppoffice/hexo-theme-icarus.git themes/icarus 此时已经下载到项目中. 顶级_config.yml中选择icarus主题 # Extensions ## Plugins: https://hexo.io/plugins/ ## Themes: https://hexo.io/t…
今天看到一个朋友在github上面的issue 大概问题就是怎么在不同的电脑上面使用 git有个这么个东西Submoudle中文叫做子模块 具体使用教程看这里Git-工具-子模块 这里只说怎么搞hexo多主题切换和换电脑啥的 开始 首先分两种情况 1. 主题的出了配置文件 或者其他文件没有DIY过,都是直接clone原来的主题作者的 2. 主题的CSS JS 文件自己改过 没有修改主题源码 如果没有修改主题源码那就按照下面的步骤来作 备份主题配置文件 文件在 themes/主题名字/_confi…
将本地hexo博客部署到github上了,如果想换我们自己喜欢的主题(默认为landscape),同时也要发表发表文章呢,下面给介绍下: 1,进入hexo官网,预览自己想要的主题,https://github.com/hexojs/hexo/wiki/Themes 这里拿light为例. 进入hexo博客的目录,如:E:/hexo/themes 右键git bash 输入: git clonehttps://github.com/hexojs/hexo-theme-light.git 然后 cd…
文章目录 tip:没有耐心的可以直接看:正式在hexo next中加入懒加载(最下面) 废话 背景 懒加载简单介绍 引入js 重点!敲黑板了!!! 完善懒加载函数 懒加载函数可配置的参数 正式在hexo next中加入懒加载 1: 2: 3:按我的步骤来,不要问为什么. 个人博客:https://mmmmmm.me 源码:https://github.com/dataiyangu/dataiyangu.github.io tip:没有耐心的可以直接看:正式在hexo next中加入懒加载(最下面…
本篇文章主要介绍我的个人博客 程序猿刘川枫 中页面使用的美化功能(基于JS实现): 1.鼠标点击出现不同颜色爱心特效 2.页面浮动多边形跟随鼠标移动 3.每日一言功能 1.鼠标点击出现爱心特效 经常在博客园或者其他个人网站中看到点击鼠标能出现不同颜色的爱心,以及烟花特效,富强民主字体等等,觉得很有意思,便研究了一下,具体如下: 效果图预览 JS代码实现 鼠标点击出现不同颜色爱心: //鼠标点击爱心 !function(e, t, a) { function r() { for (var e =…
TextView SpannableString 使用之实现可点击超链接效果 如果看到这里说明你对 TextView 已经有了一定的了解,至少已经使用过该控件显示文字过.现在来实现一些复杂一点的效果. 1. 实现可点击的超链接 我们在APP开发过程中会遇到这样的需求,例如: 其中标记为下划线的为可点击,点击后一般是跳转一个网页(这个在这里不做讨论).面对这样的需求里可能已经知道TextView是可以添加下划线的,你的实现可能是: By Login, You agree to our Privic…
一.介绍 现在很多app,附带很炫的点击效果,让用户享受到非常棒的体验,例如动画.渐变.音效等. 当然,市面上大多数app的标签栏点击还是挺中规中矩的,只是切换图片而已.然而,这个是可以优化的,附带点特效能极大为app增色. 例如音效和波动,淘宝和今日头条就是这么实现的,效果特别棒.这里实现一下UITabbarItem波动的动画. 二.代码 1.遍历标签栏控制器的UITabbarItem,给其每一个子视图按钮添加点击事件 for (UIControl *tabBarButton in [UITa…
★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★➤微信公众号:山青咏芝(shanqingyongzhi)➤博客园地址:山青咏芝(https://www.cnblogs.com/strengthen/)➤GitHub地址:https://github.com/strengthen/LeetCode➤原文地址:https://www.cnblogs.com/strengthen/p/10128172.html ➤如果链接不是山青咏芝的博客园地址,则可能是爬取作者的文章…
在默认设置下,文章链接都会改变,不利于搜索引擎收录,也不利于分享 更改index.swig文件 文件路径是your-hexo-sitethemesnextlayout,将下面代码 1 {% block title %} {{ config.title }} {% endblock %} 改成 1 {% block title %} {{ config.title }} - {{ theme.description }} {% endblock %} 这时候你的首页标题会更符合网站名称 - 网站描…
一直在使用hexo写自己的博客,最近博客刚刚搬家重新搞了下博客: 1.为hexo添加站内搜索 我用的是algolia,在next主题5.x以上的版本集成了algolia站内搜索功能,我们只需要简单的配置下就可以使用:安装: 1 npm install hexo-algolia --save 配置: 123456789 algolia: 大专栏  Hexo next主题安装algolia applicationID: 'your applicationID' apiKey: 'your apiKe…
一般情况下,当我们在3D建模中使用RayFire破碎插件来制作一些精准击碎效果时,需要将物体的击中部分定义为休眠对象,将其他未击中的部分定义为静态对象,以实现击中部分出现碎片的效果.但这种方式必须精准定位击中的碎片,操作起来有点难度. 今天我们来介绍一种新的操作方法,无须再去定位击中的碎片就能实现上面的效果,让击中的部分出现碎片,而未击中的部分则回保持原样. 图1:使用RayFire制作3D精准破碎效果 一. 添加破碎效果 首先,我们需要创建一个长方体作为被击碎物使用.然后,打开RayFire的…
在十几二十年前的时候,我们想要学习新的知识需要到学校和培训班才行,但是现在只要有一台电脑.一部手机或者平板,我们在家里也能找到我们喜欢的课程来学习了,微课也因此而生. 同样的,有了想要学习知识的学生,掌握了这些知识的人们也就有了把知识进行变现的途径,知识付费也有了存在的空间.对老师们来说,想要把知识变现,重要的便是选择一款合适的微课制作软件了.一款合适的软件可以让你的讲解更加的生动也可以让你的演示具有动画的功能,方便大家理解. 这里我们用的是Camtasia,它不仅具有录制屏幕的功能,还具有即时…
一.前言 已经习惯了 WPF.WinForm 中"万物皆可点击"的方式. 但是在 MAUI 中却不行了. 在 MAUI 中,点击.双击的效果,是需要通过"手势识别器"来实现. 本篇文章,我们就通过"手势识别器"来为 Label.Image等控件实现点击事件. 相信看完的你,一定会有所收获! 本文地址:https://www.cnblogs.com/lesliexin/p/16433623.html 二.手势识别器 本文实现点击所用到识别器是:Ta…
如何给matery主题添加Pjax? Pjax优点 1.减轻服务端压力 2.按需请求,每次只需加载页面的部分内容,而不用重复加载一些公共的资源文件和不变的页面结构,大大减小了数据请求量,以减轻对服务器的带宽和性能压力,还大大提升了页面的加载速度. 优化页面跳转体验 3.使用pjax后,只刷新部分页面,切换效果更加流畅,而且可以定制过度动画,在等待页面加载的时候体验就比较舒服了. 我知道你们在意的是教程不是这些啰嗦的废话,下面就是正文 教程 基本了解 Pjax的使用可以在保证Nav Header…