木子屋
 

标题: javascript+Css-神秘的眼睛

作者: dnawo

日期: 2008-03-17 06:52 PM

分类: 脚本语言

内容: 265.com logo用了这个效果，创意不错。
demo1：
HTML代码http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
http://www.w3.org/1999/xhtml">
神秘的眼睛
.eye{
display:inline;
overflow:hidden;
position:relative;
float:left;
margin:50px 0 0 50px;
width:50px;
height:50px;
font-size:50px;
line-height:106%;
+line-height:normal;
cursor:default;
}
@media all and (min-width:0px){
.eye{line-height:normal;}
}
.pupil{
overflow:hidden;
position:absolute;
margin:-5px 0 0 -5px;
width:10px;
height:10px;
line-height:normal;
font-size:10px;
top:50%;
left:50%;
}
○●
○●
var $=function(o){return document.getElementById(o)}
var leftEye=$("leftEye");
var rightEye=$("rightEye");
var leftPupil=$("leftPupil");
var rightPupil=$("rightPupil");
var xy=$("xy");
document.documentElement.onmousemove=function(e){
var e=window.event||e;
var eX=e.clientX, eY=e.clientY;
track(leftEye,leftPupil,eX,eY);
track(rightEye,rightPupil,eX,eY);
}
function track(o,i,eX,eY){
var oL=o.offsetLeft;
var oT=o.offsetTop;
var oW=o.offsetWidth;
var oH=o.offsetHeight;
var oCW=o.clientWidth;
var oCH=o.clientHeight;
var oX=oL+oW/2;
var oY=oT+oH/2;
var eX=eX-oX;
var eY=eY-oY;
var eXY,iL,iT;
if(eX!=0&&eY!=0){
eXY=eX/eY;
var r=oCW/2-12;
var R=Math.sqrt(eX*eX+eY*eY);
var rR=R/5>r?r:R/5;
var iL=Math.sqrt(rR*rR/(1+1/(eXY*eXY)));
if(eX

[Ctrl+A 全部选择 提示：你可先修改部分代码，再按运行]
demo2：
HTML代码
Static Eyes
//Static Eyes - http://www.btinternet.com/~kurt.grigg/javascript
if ((document.getElementById) &&
window.addEventListener || window.attachEvent){
(function(){
var e_img = new Image();
e_img.src = "pic/200803/eye.gif";
var p_img = new Image();
p_img.src = "pic/200803/pupils.gif";
var d = document;
var pix = "px";
var idx = document.images.length;
if (document.getElementById("cont"+idx)) idx++;
var eyeballs = "";
var pupil1 = "";
var pupil2 = "";
d.write(''
+''
+''
+''
+'');
function watchTheMouse(y,x){
var osy = eyeballs.offsetTop;
var osx = eyeballs.offsetLeft;
var c1y = osy + 17;
var c1x = osx + 17;
var c2y = osy + 17;
var c2x = osx + 52;
var dy1 = y - c1y;
var dx1 = x - c1x;
var d1 = Math.sqrt(dy1*dy1 + dx1*dx1);
var dy2 = y - c2y;
var dx2 = x - c2x;
var d2 = Math.sqrt(dy2*dy2 + dx2*dx2);
var ay1 = y - c1y;
var ax1 = x - c1x;
var angle1 = Math.atan2(ay1,ax1)*180/Math.PI;
var ay2 = y - c2y;
var ax2 = x - c2x;
var angle2 = Math.atan2(ay2,ax2)*180/Math.PI;
var dv = 1.7;
var onEyeBall1 = (d1

[Ctrl+A 全部选择 提示：你可先修改部分代码，再按运行]

+ 查看当前日志评论 (0)

 

登录

────────────

木子屋

PJBlog3 v3.2.9.518 Inside.

Processed In 0.047 ms

标题: javascript+Css-神秘的眼睛

你没有权限发表评论

────────────

木子屋

PJBlog3 v3.2.9.518 Inside.

Processed In 0.047 ms

暂无评论

返回

────────────

木子屋

PJBlog3 v3.2.9.518 Inside.

Processed In 0.047 ms