博客园添加鼠标粒子吸附特效

本文从以下三个方面, 阐述在博客园添加鼠标粒子吸附特效:

一. 效果展示

二. 权限申请

三. 设置步骤

一. 效果展示

在博客园的页面, 出现鼠标粒子吸附的特效, 如图所示:

二. 权限申请

点击博客园的【管理】 → 【设置】→ 一直往下拉, 找到【博客侧边栏公告(支持HTML代码)(申请JS权限)】

向[email protected] 发送邮件, 为了尽快通过权限申请, 邮件模板如下:

尊敬的博客园管理员:

请问是否可以帮我开通js权限,我需要一些简单的js来解决问题,例如鼠标点击特效、代码高亮等外观调整。

谢谢您的支持!

三. 设置步骤

点击博客园的【管理】  → 【设置】 → 一直往下拉, 找到【页脚Html代码】,添加如下代码内容, 保存即可:

<script id="c_n_script" src="https://blog-static.cnblogs.com/files/xiaokang01/js.js" color="240,230,140" opacity="1" count="75" zindex="-2">
if(/Android|webOS|iPhone|iPod|BlackBerry/i.test(navigator.userAgent)) {

} else {

}
</script>

https://blog-static.cnblogs.com/files/xiaokang01/js.js  这是添加的文件的链接
color="240,230,140"   粒子的颜色设置
opacity="1"   粒子的透明度
count="75"   粒子的个数

再返回博客园的页面, 就有鼠标粒子吸附特效了啊。

但是由于博客园的主题设置,可能只有两侧的可以点击聚集粒子,中间的部分被博客园的主题中的容器覆盖住了。可以再添加css。

点击博客园的【管理】  → 【设置】 →  找到【博客皮肤】和【页面定制css代码】,自定义博客皮肤,添加如下css代码内容, 保存即可:

body {
background-color:whitesmoke;
}     // 修改背景颜色为半透明

#home,#sideBarMain>div,#blog-sidecolumn>div>div,.catListView{
background-color:rgba(255,255,255,0);
}  // 修改其他边框的颜色

转载自:http://www.cnblogs.com/huzixia/

原文地址:https://www.cnblogs.com/yonghengshikong/p/11758846.html

时间: 2024-10-11 16:20:54

博客园添加鼠标粒子吸附特效的相关文章

博客园添加鼠标点击特效:字符表情包

在博客园的设置中可以看到「页首Html代码」这一项. 首先要申请 JS 权限,理由就是想要美化博客.设置鼠标点击特效等,自己补充. 「页首Html代码」处代码如下: <script type="text/javascript"> /* 鼠标特效 */ var a_idx = 0; jQuery(document).ready(function($) { $("body").click(function(e) { var a = new Array(&qu

博客园添加鼠标点击特效

原文:http://www.cnblogs.com/xiaokang01/p/9911501.html 废话少说先看效果: 复制下面代码,点击博客园 管理-->设置 然后 在保存就好了 代码如下 <script type="text/javascript"> /* 鼠标特效 */ var a_idx = 0; jQuery(document).ready(function($) { $("body").click(function(e) { var

博客园添加旋转的正方体特效

哇,这个旋转的正方体特效也十分好看呢 参考链接:https://www.cnblogs.com/Trojan00/p/9497480.html 效果展示 具体步骤 将代码复制即可 代码如下:(在博客侧边栏公告(支持HTML代码)中粘贴即可) <style> /*最外层容器样式*/ .wrap { width: 100px; height: 100px; margin: 150px; position: relative; } /*包裹所有容器样式*/ .cube { width: 50px;

博客园添加鼠标动态线条

说明:本人刚建立博客不久,看到其他博主的博客上有这么一个炫酷的 鼠标效果,捣鼓了一下,也整了一个 参考链接:https://www.cnblogs.com/php-linux/p/10565156.html 效果展示 只要将鼠标放在一边不动,就会有线条聚集到鼠标,是不是很炫酷呢 具体步骤 第一步:首先要做的就是申请权限,没有权限是做不了的 进入博客页面后→在导航栏中点击“管理”→选择“设置”→ 在“博客侧边栏公告(支持HTML代码)”,若没有js权限, 会显示申请权限:若有js权限,则显示支持j

博客园自定义鼠标点击特效

需要申请JS权限,JS权限申请通过之后,将如下代码放入侧边栏,页首,页末,都可以 复制如下代码 <script type="text/javascript"> /* 鼠标特效 */ var a_idx = 0; jQuery(document).ready(function($) { $("body").click(function(e) { var a = new Array("?Linux?","?Shell?"

博客园添加背景音乐,背景效果!

目录 博客园添加背景音乐,背景效果 申请博客园JS权限 添加网易云背景音乐 点击鼠标点击样式 二次元看板娘 雪花效果 原文地址:https://www.cnblogs.com/1212dsa/p/11438461.html

为博客园添加目录的方法总结

博客园添加目录的方法主要涉及2个步骤: 1.申请开通js权限 2.添加js脚本到“页脚Html代码” <script language="javascript" type="text/javascript"> // 生成目录索引列表 // ref: http://www.cnblogs.com/wangqiguo/p/4355032.html // modified by: zzq function GenerateContentList() { var

博客园添加markdown文章导航栏

博客园添加Markdown文章导航栏 我正在翻译Spring Framework文档,发布到博客园之后发现文章太密集,猛一看到比较懵,由于看到博客园支持自定义页面,我觉得添加一个导航栏,结构上会更加清晰一些. 所以在网上搜了搜关于添加导航栏的文章,搜到一个试了试,有些问题,所以就自己写了一个,实现功能如下: 主要搜索主页面中的h1-h6 根据1-6的级别设置字体大小和缩进宽度 滚动时页面最上方的标题对应导航将加粗 支持展开隐藏(默认隐藏,如果默认打开,就将js代码第6行display:none改

【转】为博客园添加目录的方法总结

本文转自:作者:妙音天女    地址:http://www.cnblogs.com/xuehaoyue/p/6650533.html 目录 第一种:在正文上方直接添加目录 1. 申请开通js权限 2. 添加js脚本到“页脚Html代码” 3. 按格式写文章 第二种:在文章右上角添加目录导航 1. 申请开通js权限 2. 添加css代码到“页面定制CSS代码” 3. 添加js脚本到“页首Html代码” 4. 按格式写文章 参考链接:http://www.cnblogs.com/xdp-gacl/p