jQuery实现炫酷的鼠标轨迹特效
代码：
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>jQuery实现炫酷的鼠标轨迹特效</title><base target="_blank" />
<script type="text/javascript"> window.onload = function () {
C = Math.cos; S = Math.sin; U = 0; w = window; j = document; d = j.getElementById("kele"+"yi_com"); c = d.getContext("2d"); W = d.width = w.innerWidth; H = d.height = w.innerHeight; c.fillRect(0, 0, W, H); c.globalCompositeOperation = "lighter"; c.lineWidth = 0.2; c.lineCap = "round"; var bool = 0, t = 0; d.onmousemove = function (e) {
if (window.T) {
if (D == 9) { D = Math.random() * 15; f(1); }
clearTimeout(T);
}
X = e.pageX; Y = e.pageY; a = 0; b = 0; A = X, B = Y; R = (e.pageX / W * 999 >> 0) / 999; r = (e.pageY / H * 999 >> 0) / 999; U = e.pageX / H * 360 >> 0; D = 9; g = 360 * Math.PI / 180; T = setInterval(f = function (e) {
c.save(); c.globalCompositeOperation = "source-over"; if (e != 1) { c.fillStyle = "rgba(0,0,0,0.02)"; c.fillRect(0, 0, W, H); }
c.restore(); i = 25; while (i--) {
c.beginPath(); if (D > 450 || bool) {
if (!bool) { bool = 1; }
if (D < 0.1) { bool = 0; }
t -= g; D -= 0.1;
}
if (!bool) { t += g; D += 0.1; }
q = (R / r - 1) * t; x = (R - r) * C(t) + D * C(q) + (A + (X - A) * (i / 25)) + (r - R); y = (R - r) * S(t) - D * S(q) + (B + (Y - B) * (i / 25)); if (a) { c.moveTo(a, b); c.lineTo(x, y) }
c.strokeStyle = "hsla(" + (U % 360) + ",100%,50%,0.75)"; c.stroke(); a = x; b = y;
}
U -= 0.5; A = X; B = Y;
}, 16);
}
j.onkeydown = function (e) { a = b = 0; R += 0.05 }
d.onmousemove({ pageX: 300, pageY: 290 })
}</script>
<style>body{margin:0;overflow:hidden}div{padding:1px 5px;background:#333;position:absolute;z-index:2;color:#555;font-family:arial}a{color:#ccf}a:hover{color:red}</style>
</head>
<body>
<div id="text"></div>
<canvas id="keleyi_com"></canvas>
</body>
</html>
以上就是本文的内容了，希望小伙伴们喜欢此特效，快过年了，给自己的个人主页增添些色彩吧。
-
本文向大家介绍Android实现炫酷的CheckBox效果，包括了Android实现炫酷的CheckBox效果的使用技巧和注意事项，需要的朋友参考一下 首先贴出实现的效果图： gif的效果可能有点过快，在真机上运行的效果会更好一些。我们主要的思路就是利用属性动画来动态地画出选中状态以及对勾的绘制过程。看到上面的效果图，相信大家都迫不及待地要跃跃欲试了，那就让我们开始吧。 自定义View的第一步：自
-
本文向大家介绍js+css3实现炫酷时钟，包括了js+css3实现炫酷时钟的使用技巧和注意事项，需要的朋友参考一下 本文实例为大家分享了js+css3实现炫酷时钟的具体代码，供大家参考，具体内容如下 html css js 作品截图 以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持呐喊教程。
-
本文向大家介绍jquery和css3实现的炫酷时尚的菜单导航，包括了jquery和css3实现的炫酷时尚的菜单导航的使用技巧和注意事项，需要的朋友参考一下 今天为大家带来的是jquery和css3实现的不错的导航菜单。点击列表图表后，内容页面向内移动显示菜单项。当单击关闭菜单按钮时，菜单项隐藏，内容页恢复原位。看下图 源码下载 我们看下实现代码： html代码： css代码： js代码：
-
本文向大家介绍javascript实现炫酷的拖动分页，包括了javascript实现炫酷的拖动分页的使用技巧和注意事项，需要的朋友参考一下 javascript实现炫酷的拖动分页 js html: 以上所述就是本文的全部内容了，希望大家能够喜欢。
-
本文向大家介绍canvas轨迹回放功能实现，包括了canvas轨迹回放功能实现的使用技巧和注意事项，需要的朋友参考一下 本文通过json机构，HTML代码以及JS代码详细给大家分析了canvas轨迹回放功能实现的过程，以下是全部内容。 json结构 html 将json作为js文件引入，并将其赋值给全局变量testPath(引入方式按照实际项目要求来) js 以上就是本次文章的全部内容，如果大家在
-
本文向大家介绍jquery实现鼠标悬浮停止轮播特效，包括了jquery实现鼠标悬浮停止轮播特效的使用技巧和注意事项，需要的朋友参考一下 本文实例讲述了jquery实现鼠标悬浮停止轮播特效代码。分享给大家供大家参考，具体如下： 运行效果截图如下： 具体代码如下： 一、主体程序 二、CSS样式 三、jQuery程序 先说一下鼠标悬浮图片轮播停止的原理： 1、当鼠标悬浮在框架上方时，清除定时器即用cle