您的位置：首页 > Web前端 > JavaScript

js在鼠标周围加旋转文字

2014-01-14 22:14 399 查看

记不得是谁家博客截取的源码了，哈哈，代码如下，copy下看下效果吧

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title></title>
</head>
<body>
<div>
<script LANGUAGE="JavaScript">
if (document.all) {
yourLogo = "认识自己的无知是认识世界的最可靠的方法!";
logoFont = "黑体";
logoColor = "#FF33FF";
yourLogo = yourLogo.split('');
L = yourLogo.length;
TrigSplit = 360 / L;
Sz = new Array()
logoWidth = 100;
logoHeight = -30;
ypos = 0;
xpos = 0;
step = 0.03;
currStep = 0;
document
.write('<div id="outer" style="position:absolute;top:0px;left:0px"><div style="position:relative">');
for (i = 0; i < L; i++) {
document
.write('<div id="ie" style="position:absolute;top:0px;left:0px;'
+'width:10px;height:10px;font-family:'+logoFont+';font-size:12px;'
+'color:'+logoColor+';text-align:center">'
+ yourLogo[i] + '</div>');
}
document.write('</div></div>');
function Mouse() {
ypos = event.y;
xpos = event.x - 5;
}
document.onmousemove = Mouse;
function animateLogo() {
outer.style.pixelTop = document.body.scrollTop;
for (i = 0; i < L; i++) {
ie[i].style.top = ypos
+ logoHeight
* Math.sin(currStep + i * TrigSplit * Math.PI
/ 180);
ie[i].style.left = xpos
+ logoWidth
* Math.cos(currStep + i * TrigSplit * Math.PI
/ 180);
Sz[i] = ie[i].style.pixelTop - ypos;
if (Sz[i] < 5)
Sz[i] = 5;
ie[i].style.fontSize = Sz[i] / 1.7;

}

currStep -= step;

setTimeout('animateLogo()', 20);

}

window.onload = animateLogo;

}
</script>
</div>
</body>
</html>

效果如下

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签： 鼠标 javascript 鼠标样式

相关文章推荐

新的分享

章节导航