<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>完美的鼠标跟随特效-jq22.com</title>
<script src="http://libs.baidu.com/jquery/2.1.4/jquery.min.js"></script>
<style>
* {
margin:0;
padding:0;
-webkit-box-sizing:border-box;
-moz-box-sizing:border-box;
-ms-box-sizing:border-box;
-o-box-sizing:border-box;
box-sizing:border-box;
}
html,body {
margin:0;
padding:0;
font:16px/1.4 'Lato',sans-serif;
color:#fefeff;
-webkit-font-smoothing:antialiased;
font-smoothing:antialiased;
}
body {
background:rgb(8,5,16);
-webkit-touch-callout:none;
-webkit-user-select:none;
-khtml-user-select:none;
-moz-user-select:none;
-ms-user-select:none;
user-select:none;
}
h1 {
font:2.75em 'Cinzel',serif;
font-weight:400;
letter-spacing:0.35em;
text-shadow:0 0 25px rgba(254,254,255,0.85);
}
h2 {
font:1.45em 'Cinzel',serif;
font-weight:400;
letter-spacing:0.5em;
text-shadow:0 0 25px rgba(254,254,255,0.85);
text-transform:lowercase;
}
[class^="letter"] {
-webkit-transition:opacity 3s ease;
-moz-transition:opacity 3s ease;
transition:opacity 3s ease;
}
.letter-0 {
transition-delay:0.2s;
}
.letter-1 {
transition-delay:0.4s;
}
.letter-2 {
transition-delay:0.6s;
}
.letter-3 {
transition-delay:0.8s;
}
.letter-4 {
transition-delay:1.0s;
}
.letter-5 {
transition-delay:1.2s;
}
.letter-6 {
transition-delay:1.4s;
}
.letter-7 {
transition-delay:1.6s;
}
.letter-8 {
transition-delay:1.8s;
}
.letter-9 {
transition-delay:2.0s;
}
.letter-10 {
transition-delay:2.2s;
}
.letter-11 {
transition-delay:2.4s;
}
.letter-12 {
transition-delay:2.6s;
}
.letter-13 {
transition-delay:2.8s;
}
.letter-14 {
transition-delay:3.0s;
}
h1,h2 {
visibility:hidden;
-webkit-transform:translate3d(0,0,0);
-moz-transform:translate3d(0,0,0);
transform:translate3d(0,0,0);
}
h1.transition-in,h2.transition-in {
visibility:visible;
}
h1 [class^="letter"],h2 [class^="letter"] {
opacity:0;
}
h1.transition-in [class^="letter"],h2.transition-in [class^="letter"] {
opacity:1;
}
#container {
display:table;
position:absolute;
z-index:20;
width:100%;
height:100%;
text-align:center;
cursor:none;
}
#container > div {
display:table-cell;
vertical-align:middle;
}
#container p {
position:absolute;
width:100%;
left:0;
bottom:25px;
font-size:0.8em;
letter-spacing:0.1em;
font-weight:300;
color:#76747a;
-webkit-font-smoothing:subpixel-antialiased;
font-smoothing:subpixel-antialiased;
}
#container p strong {
color:#b3abc5;
}
#container p span {
font-size:0.75em;
padding:0 2px;
}
#canvas {
position:absolute;
z-index:10;
top:0;
left:0;
width:100%;
height:100%;
cursor:none;
}
#stats {
position:absolute;
z-index:10;
left:10px;
top:10px;
}
.dg.ac {
z-index:100 !important;
}
</style>
</head>
<body>
<div id="container">
<div>
<h1 id="h1">
我很快乐，很幸福！ </h1>
<h2 id="h2">wwwwwwwwwwwqqqqqqqqq</h2>
</div>
</div>
<canvas id="canvas"></canvas>
<audio autoplay="autoplay">
<source src="http://m2.music.126.net/z5t-DBv6ugHWN8BCGynjSw==/7715273092477776.mp3" type="audio/mpeg">
</audio>
<script>
var Stats = function() {
var e = Date.now(),
t = e,
i = 0,
n = 1 / 0,
r = 0,
s = 0,
o = 1 / 0,
a = 0,
l = 0,
h = 0,
c = document.createElement("div");
c.id = "stats", c.addEventListener("mousedown", function(e) {
e.preventDefault(), v(++h % 2)
}, !1), c.style.cssText = "width:80px;opacity:0.9;cursor:pointer";
var u = document.createElement("div");
u.id = "fps", u.style.cssText = "padding:0 0 3px 3px;text-align:left;background-color:#002", c.appendChild(u);
var d = document.createElement("div");
d.id = "fpsText", d.style.cssText = "color:#0ff;font-family:Helvetica,Arial,sans-serif;font-size:9px;font-weight:bold;line-height:15px", d.innerHTML = "FPS", u.appendChild(d);
var p = document.createElement("div");
for (p.id = "fpsGraph", p.style.cssText = "position:relative;width:74px;height:30px;background-color:#0ff", u.appendChild(p); 74 > p.children.length;) {
var f = document.createElement("span");
f.style.cssText = "width:1px;height:30px;float:left;background-color:#113", p.appendChild(f)
}
var m = document.createElement("div");
m.id = "ms", m.style.cssText = "padding:0 0 3px 3px;text-align:left;background-color:#020;display:none", c.appendChild(m);
var g = document.createElement("div");
g.id = "msText", g.style.cssText = "color:#0f0;font-family:Helvetica,Arial,sans-serif;font-size:9px;font-weight:bold;line-height:15px", g.innerHTML = "MS", m.appendChild(g);
var y = document.createElement("div");
for (y.id = "msGraph", y.style.cssText = "position:relative;width:74px;height:30px;background-color:#0f0", m.appendChild(y); 74 > y.children.length;) {
var f = document.createElement("span");
f.style.cssText = "width:1px;height:30px;float:left;background-color:#131", y.appendChild(f)
}
var v = function(e) {
switch (h = e) {
case 0:
u.style.display = "block", m.style.display = "none";
break;
case 1:
u.style.display = "none", m.style.display = "block"
}
},
b = function(e, t) {
var i = e.appendChild(e.firstChild);
i.style.height = t + "px"
};
return {
REVISION: 11,
domElement: c,
setMode: v,
begin: function() {
e = Date.now()
},
end: function() {
var h = Date.now();
return i = h - e, n = Math.min(n, i), r = Math.max(r, i), g.textContent = i + " MS (" + n + "-" + r + ")", b(y, Math.min(30, 30 - 30 * (i / 200))), l++, h > t + 1e3 && (s = Math.round(1e3 * l / (h - t)), o = Math.min(o, s), a = Math.max(a, s), d.textContent = s + " FPS (" + o + "-" + a + ")", b(p, Math.min(30, 30 - 30 * (s / 100))), t = h, l = 0), h
},
update: function() {
e = this.end()
}
}
};
;
(function(window) {
var ctx,
hue,
logo,
form,
buffer,
target = {},
tendrils = [],
settings = {};
settings.debug = true;
settings.friction = 0.5;
settings.trails = 20;
settings.size = 50;
settings.dampening = 0.25;
settings.tension = 0.98;
Math.TWO_PI = Math.PI * 2;
// ========================================================================================
// Oscillator
// ----------------------------------------------------------------------------------------
function Oscillator(options) {
this.init(options || {});
}
Oscillator.prototype = (function() {
var value = 0;
return {
init: function(options) {
this.phase = options.phase || 0;
this.offset = options.offset || 0;
this.frequency = options.frequency || 0.001;
this.amplitude = options.amplitude || 1;
},
update: function() {
this.phase += this.frequency;
value = this.offset + Math.sin(this.phase) * this.amplitude;
return value;
},
value: function() {
return value;
}
};
})();
// ========================================================================================
// Tendril
// ----------------------------------------------------------------------------------------
function Tendril(options) {
this.init(options || {});
}
Tendril.prototype = (function() {
function Node() {
this.x = 0;
this.y = 0;
this.vy = 0;
this.vx = 0;
}
return {
init: function(options) {
this.spring = options.spring + (Math.random() * 0.1) - 0.05
各种JS特效打包，共48个，很全，想要的大部分特效，这里都有
需积分: 10 3 浏览量
2018-12-22
09:03:27
上传
评论
收藏 2.7MB ZIP 举报
js特效_打包.zip （50个子文件） 
js特效 
CSS3弹簧线圈动画.rar 6KB
纯CSS3红心跳动动画特效.zip 3KB 纯CSS3多层圆环加载动画特效.zip 5KB 纯CSS3地球绕太阳自转特效.zip 3KB HTML5雷达地区扫描动画特效.zip 14KB CSS3日食天狗食月动画特效.zip 3KB 纯CSS3浮动的小猪动画 投影效果逼真.rar 40KB CSS3火焰效果文字特效.rar 849B HTML5 Canvas烟花动画 随机色彩、高度和角度.rar 163KB jQuery可拖拽旋转的3D图片墙.rar 94KB HTML5 3D 粒子波浪动画特效.rar 88KB HTML5 canvas太空黑洞效应动画.zip 4KB
html5 canvas跟随鼠标粒子线条动画特效.html 5KB DNA螺旋粒子动画CSS3特效.zip 30KB HTML5积木动画 可选择飞入飞出动画效果.rar 48KB HTML5 Canvas 随机色彩光束爆炸动画特效.rar 3KB jQuery动态的文字跳动动画特效.zip 38KB jQuery+CSS3悬停悬停翻转特效.zip 161KB Canvas粒子图形变形动画特效.zip 37KB HTML5 Canvas雷达扫描动画特效.rar 38KB js弹幕2.html 3KB HTML5圆形波浪加载动画特效.zip 38KB jQuery 3D 响应式图片墙动画.rar 730KB HTML5鼠标跟随星星光标特效.zip 41KB HTML5 Canvas火焰闪烁动画 火焰跟随鼠标.rar 3KB js标签云球形滚动文字特效代码.zip 5KB jQuery 3D叠加切换效果代码.zip 126KB HTML5制作ascii码表文字特效.zip 4KB 网页画图工具跟随鼠标画图效果代码 
index.js 3KB index.html 525B sketch.min.js 6KB HTML5 Canvas火焰燃烧动画 如同掉落的火球.rar 34KB 流量雨.html 7KB HTML5 Canvas生成粒子效果的人物头像.rar 281KB 纯CSS3实现打火机火焰动画.rar 7KB CSS3实现3D魔方动画特效.zip 102KB HTML5庆祝2018年烟花动画特效.zip 4KB HTML5 Canvas全屏烟花动画特效.zip 5KB html5线条传输能量动画特效.zip 208KB HTML5 Canvas发光Loading动画.rar 38KB 鼠标跟随特效变幻线.html 16KB HTML5 Canvas 梦幻数生长动画.rar 26KB HTML5街头霸王游戏.rar 251KB 互动星空.html 6KB jQuery球状放大镜特效插件.rar 2KB HTML5 Canvas蝌蚪游走特效.zip 5KB HTML5 Canvas粒子模拟效果.rar 10KB 太极.rar 846B HTML5 Canvas 3D旋转物体动画 模糊发光特效.rar 2KB HTML5 Canvas星云动画特效.rar 43KB资源评论
一个傻子程序媛
- 粉丝: 78
- 资源: 2
最新资源
- 877668389368492摩托车队经理.apk
- IDM下载器官网免安装包，注册CMD文件，突破30天的限制
- qud.win.1.1-installer-10053.9.zip
- adb-r-linux.zip adb-r-linux.zip
- 对光伏出力预测的优化设计，实现了部分功能(注释完全，可直接运行)(文档加Matlab源码)
- 70-android.rules
- 可用于光伏出力预测，引入气象影响因子，效果良好(注释完全，可直接运行)(文档加Matlab源码)
- 利用白噪声特性和ARMR模型，通过求解模型参数生成随机风速(注释完全，可直接运行)(文档加Matlab源码)
- 51-android.rules
- RecationTest.zip
资源上传下载、课程学习等过程中有任何疑问或建议，欢迎提出宝贵意见哦~我们会及时处理！
点击此处反馈
