得知途径 B3log提供了两套博客系统,一个是用Java开发的,叫做Solo,我也是在网上搜索Java博客系统时发现了它,之后才了解了B3log:还有一个是用Go语言开发的,叫做Pipe.其中Solo是需要自己在自己的云主机上搭建的,而Pipe可以选择自己搭建,也可以使用B3log搭建好的服务. 在Pipe的主页,背景使用了一个非常酷炫的粒子特效,而且还能和鼠标指针互动. 我最近正好在学习网页制作,就想着如果能把这个背景放到我自己的网页上就好了.一般这种效果不会是网页开发者自己写的,而是去调用一…
实现效果:效果预览 css代码: .switch_images { display: inline-block; margin:; padding:; width: 100%; height: 100%; list-style: none; position: fixed; top:; left:; z-index: -999; } .switch_images li { display: inline-block; height: 100%; width: 100%; position: ab…
只需要在HTML,body中加如这行代码就可以实现效果,可以在color中修改颜色 <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title></title> </head> <body> <script type="text/javascript" color="0,205,205"…
先上一张效果图: 这种动态的背景特效,制作起来其实非常简单. 使用了particles.js particles.js可以从github网站下载到最新的源码,网址是 https://github.com/VincentGarreau/particles.js/ 使用方法非常简单 第一步,在html中引入脚本文件 particles.min.js,这个文件在下载的压缩包里可以找到 <script src="particles.min.js"></script> 第…
好久没登录知乎,发现他们的登录页面粒子动态效果蛮炫的,查一下代码用了Particles.js基于Canvas画布创建粒子颗粒效果. 上图 上图:   感觉有比格,就照着弄了一个,玩玩.   github: https://github.com/VincentGarreau/particles.js/ 操作过程: 网上有基本流程,可以参考一下,不过直接用在登录页面 会有小bug,需要调整下. 1.首先在页面中引入particles.js文件. <script src="js/particle…
今天偶然看到了一个比较炫酷的js网页.是粒子特效的,就试着用了用.一下是步骤,方便以后查看使用. 1.在网站下载源码https://github.com/VincentGarreau/particles.js 2.下载下来是一个压缩包,解压后有很多文件,最少需要app.js,particles.js,stats.js这三个文件才可以实现最基本功能 3.在把其中的index.html嵌入到自己的web项目中,并且替换其中的目录就可以了. 其中最重要的一点是,index.html中的<script>…
Three.js粒子特效,shader渲染初探 转载来源:https://juejin.im/post/5b0ace63f265da0db479270a 这大概是个序 关于Three.js,网上有不多不少的零碎教程,有些过于初级,有些云里雾里,而Three.js官网上的示例逼格之高又令人望而却步,这些对于没学过计算机图形学的童鞋来说,就像入门迈槛不知先迈左脚还是右脚,兴趣使然,于是我就先双脚蹦了进去试试水...... 本文将以尽量戏剧化的语言描述网页3D世界的构建流程及表面原理(因为深层原理我目…
本文基于three.js实现特定容器的粒子特效效果,支持用户传入特定的dom对象以及粒子颜色. 效果图 移入库 <script src="jquery-1.11.3.min.js" type="text/javascript"> </script> <script src="three.min.js" type="text/javascript"></script> <sc…
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <body><title>原生js写的贪吃蛇网页版游戏特效代码 demo by js.alixixi.com</title></body> <script> Star = { init:function(){ var bigDiv = this.appendEl…
文章目录 使用方法 自定义参数 相关链接 Particles.js是一款基于HTML5 Canvas画布的轻量级粒子动画插件,可以设置粒子的形状.旋转.分布.颜色等属性,还可以动态添加粒子,效果非常炫酷,能和鼠标互动吸附或者是躲避鼠标指针. 使用方法 1.该粒子动画库插件使用方法非常简单,首先要在页面中引入particles.js文件. <script src="js/particles.js"></script> 2.在页面中使用一个div来作为放置粒子的容器…