博客园添加动态背景效果

最新推荐文章于 2023-12-05 16:22:06 发布
最新推荐文章于 2023-12-05 16:22:06 发布
阅读量2.2k 收藏 2
点赞数 3
文章标签： java
原文链接：http://www.cnblogs.com/lfri/p/10010907.html
版权
本文介绍了如何在博客园中添加基于HTML5 canvas的动态背景效果。通过引入canvas-nest.js库，调整参数如线条颜色、透明度、数量和zIndex，实现个性化动态背景。详细步骤包括下载库文件、上传至博客园并插入页首HTML代码。
摘要由CSDN通过智能技术生成

背景动画

先直接看效果吧，还是挺有趣的

 （来自官网上的一张图）

使用食用

食用方法

先良心安利js写的动画库。其原理就是基于 HTML5 新特性 canvas，渲染的动画效果。有兴趣可以访问一下：动画库原地址，里面有使用方法的详细介绍，这里不赘述了。

首先下载其中的canvas-nest.js,然后上传到博客园后台的文件，得到一

最低0.47元/天 解锁文章
dianshu1593
关注
  • 3
    点赞
  • 踩
  • 2
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
JS仿博客园首页左导航效果
04-23
本教程将详细讲解如何使用JS来仿制博客园首页的左导航效果，这是一个包含二级菜单的动态导航栏，能够提供良好的用户体验和视觉效果。 首先，我们需要理解导航栏的基本结构。一个常见的导航栏通常由一系列链接组成，...
在博客园博文中添加自定义右键菜单的方法详解
10-15
在博客园博文中添加自定义右键菜单是一种增强用户体验的方式，尤其对于长篇文章，它可以提供更便捷的功能访问，如快速回到顶部、点赞和评论。本文将深入探讨如何利用DOM鼠标事件来实现这一功能。 首先，我们需要...
【博客园美化】博客园简单动态背景美化（css个人现写的，不喜勿喷）
最新发布
Tonyhnv的博客
12-05 1039
important;important;important;
博客园动态背景实现，看板娘实现，音乐播放器实现 ，优美背景 实现-------大综合...
weixin_30338461的博客
06-13 317
具体效果我就不多说了，看见我的首页相信你们就知道了，好了闲话不多说直接上我的源码（不过大家还是都换换背景和一些样式好点一下，毕竟太多人用一样的也不大好）！下面是我花了2天在各个网络资源整合后写出来的东西，看完记得 点赞，关注哦！！！ css代码: #c{ position: fixed; top:0; left: 0; z-index:-1; opacity:0.8; ...
博客园添加背景图片
afu42832的博客
09-28 595
目录 步骤 1.在博客园的相册中添加需要作为背景的图片 2.复制图片地址。 3.粘贴css代码。 参考 步骤 1.在博客园的相册中添加需要作为背景的图片 管理>相册，新建相册并上传图片，注意图片大小不能超过3m，我使用...
在博客添加网页背景动画效果，跟随鼠标移动的线条
djh10000的博客
09-07 452
在博客网页上看到有这样的动效背景动画，可以根据鼠标移动位置来拖动线条 emm,工作放空的时候可以用来点着玩儿。。。 设置方式是在博客的“管理-->设置”，然后在设置中的页脚HTML代码中添加 <script> !function(){ function n(n,e,t){ return n.getAttribute(e)|...
博客样式(动态背景线条跟随鼠标移动)
weixin_33888907的博客
08-18 1882
代码(将代码添加至页脚html板块): 1 <!--代码放置于</body>上方--> 2 3 <script> 4 5 !function(){ 6 7 function n(n,e,t){ 8 9 return n.getAttribute(e)||t 10 11 } 12 13 functi...
博客园导航
04-23
在制作博客园导航时，我们可以利用CSS来设置导航条的背景色、字体、边框、悬浮效果等，以营造出美观且符合网站整体风格的界面。CSS3的引入还允许我们创建更复杂的动画效果，比如过渡和变换，使导航栏更具视觉吸引力...
Beautifycnblogs博客园样式美化
08-10
项目中的"JavaScript开发-CSS相关"标签提示我们，可能还需要利用JavaScript来实现一些动态效果。JavaScript是一种轻量级的解释型编程语言，常用于网页和网络应用的开发。它可以与CSS结合，通过事件监听、DOM操作等...
博客园主题eXtremelySimple极简
08-11
5. **动画效果**：通过添加JavaScript库如jQuery，可以轻松实现平滑过渡和动画效果，增加视觉吸引力。 二、CSS 相关 CSS（层叠样式表）用于控制网页的布局和样式。在eXtremely Simple主题中，CSS发挥着至关重要的...
HTML5彩带飘动消失动画特效.zip
07-04
HTML5彩带飘动消失动画特效是一款html5基于canvas 2D画布全屏的彩带飘动消失动画背景特效。
博客园背景图片设置
个人记录
05-23 169
博客园背景图片设置
博客园自定义背景
weixin_30920513的博客
07-04 311
写在前面，这个教程不是我原创，只是我换背景的时候找了三篇博文才把背景换好，所以总结一下，让朋友们少走弯路。 改完背景后我发现其实只是把css代码里的背景地址换成我们想要设置的图片地址就可以，所以直接进入第3步就可以，小白的话可以从第1步开始看。 1.先获取背景地址，直接去网上找喜欢的图片的地址就可以了，但是这样的缺点是万一那张图片的地址变了，博客园的背景就跟着变了，所以可以先把背景存博客...
动态背景
weixin_44540452的博客
05-17 652
=============================动态背景===================== 最近在做一些新的项目联系；现在处于那种会的迷迷糊糊，不会的有待提高那种状态；终于在迷迷糊糊里面总能捡到一些新鲜的东西；这也是我这几天搭建框架的时候；发现了一些以前的新东西；也不能算新东西吧；算一个发现的一个小技巧吧； 在做很多软件的时候，都会有登录页面；有些页面高级到特别炫酷；就比如我...
博客园能有这种背景就很强大了！
weixin_30616969的博客
06-03 127
博客园能有这种背景就很强大了！ 转载于:https://www.cnblogs.com/pricks/archive/2009/06/03/1495336.html
博客园背景特效（粒子线条，彩带，滴墨水）
weixin_45511682的博客
02-16 3547
博客园背景特效js
笔记：live2d4.0 sdk 博客园网页动画
weixin_44128558的博客
03-27 9385
1.准备 1.1下载live2d live2d官网：https://www.live2d.com 1.2安装live2d 一路next，安装好后会有两个文件： Live2D Cubism Viewer 4.0（这个是查看模型的软件） Live2D Cubism Editor 4.0（这个是制作模型的软件） Live2D Cubism Editor 4.0有pro版和free版，用free版就行...
动态背景图
weixin_41022957的博客
04-20 337
1.项目中要用到，百度了很多，原创的链接忘记了，原文是呐ts写得，自己改了一下，放到了vue中,使用的时候直接放入到vue项目中就行，注意页面内容和背景的层级关系就可以 <template> <div style="position: relative" id="main"> <div></div> <canvas ref="cas" id="canvas"> </canvas> </div> &l
博客园背景彩带特效
xxzh_pengpeng的博客
03-29 890
设计自己的神奇小彩带，你只需这几步： 点开博客园后台 点开设置 找到“页首 HTML 代码”（页尾也可以） 输入代码保存即可 （要先申请js权限哦） 代码如下： <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Tit...
c++笔试题库 博客园
10-10
博客园是一个知名的中文博客平台，也是中国最大的独立博客社区之一。它为广大用户提供了一个方便的分享和交流的平台。其中，c 笔试题库是博客园上一个针对 C 语言编程的题库。 该题库主要面向对 C 语言有一定基础的...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值