仿265上网导航眼睛会动的LOGO代码与变量说明

yqxbc 发布时间：08-27 来源：一起学编程浏览：25次

　　网上有各种各样类似效果的代码，但是都没有变量说明，自己很难修改使用，以下是带详细说明的版本。

　　完整的代码：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">\n<html xmlns="http://www.w3.org/1999/xhtml">\n<head>\n<title>仿265上网导航眼睛会动的LOGO</title>\n<meta http-equiv="content-type" content="text/html;charset=gb2312">\n</head>\n<body>\n<p id="logo"><a><img id="logoimg" src="http://www.zzsky.cn/effect/images/201008212000/logo.gif"></a></p>\n<script language="javascript">\nfunction m(a, b)\n{\n  return a.position = b\n}\nfunction o(a, b)\n{\n  return a.left = b\n}\nfunction ca(a, b)\n{\n  return a.zIndex = b\n}\nvar p = "length", r = "style", s = "body", x, y;\nfunction U(a)\n{\n  return document.createElement(a)\n}\nvar Y, mb, nb, ob, pb, Z, $;\nvar qb = 20, rb = 22, sb = 20, tb = 28, ub = 33, vb = 28, wb = 22, xb = 27, yb = 31, zb = 27, Ab = 6, Bb = 4, Cb = 1, Db = 200;\nvar Eb;\nvar Fb = "http://www.zzsky.cn/effect/images/201008212000/logo.gif";\nfunction Gb(a)\n{\n  var b = 0, c = 0;\n  if (a.pageX || a.pageY)\n  {\n    b = a.pageX;\n    c = a.pageY\n  }\n  else if (a.clientX || a.clientY)\n  {\n    b = a.clientX + document[s].scrollLeft;\n    c = a.clientY + document[s].scrollTop\n  }\n  return [b, c]\n}\nfunction Ib(a)\n{\n  Jb();\n  a = a || document.parentWindow.event;\n  var b = Gb(a), c = b[0], d = b[1];\n  Kb(c, d, Z, sb, tb);\n  Kb(c, d, $, ub, vb)\n}\nfunction Kb(a, b, c, d, g)\n{\n  var e = a - d - mb, f = (b - g - nb) * (Ab / Bb), j = Math.sqrt(Math.pow(e, 2)\n    + Math.pow(f, 2)), h, l;\n  if (j == 0)\n  {\n    h = d;\n    l = g\n  }\n  else\n  {\n    var B = Math.sqrt(Math.pow(j, 2) + Math.pow(Db, 2)), E = Ab * j / B;\n    h = E * e / j + d + mb;\n    l = E * f / j / (Ab / Bb) + g + nb\n  }\n  h -= Cb;\n  l -= Cb;\n  o(c[r], parseInt(h, 10) + "px");\n  c[r].top = parseInt(l, 10) + "px"\n}\nfunction EYES_init()\n{\n  var a = Mb("logo"), b = Nb(a, "a");\n  Eb = Nb(a, "img");\n  if ( - 1 == Eb.src.indexOf(Fb))\n  {\n    return\n  }\n  Y = U("img");\n  Z = U("img");\n  $ = U("img");\n  Y.border = (Z.border = ($.border = 0));\n  Y.src = "http://www.zzsky.cn/effect/images/201008212000/dang.gif";\n  Z.src = ($.src = "http://www.zzsky.cn/effect/images/201008212000/eye.gif");\n  Jb();\n  m(Y[r], m(Z[r], m($[r], "absolute")));\n  ca(Y[r], 90);\n  ca(Z[r], ca($[r], 100));\n  b.appendChild(Y);\n  b.appendChild(Z);\n  b.appendChild($);\n  document.onmousemove = Ib;\n  T(window, "pageshow", Jb);\n  T(window, "resize", Jb)\n}\nfunction Jb()\n{\n  var a = Ob(Eb);\n  mb = a.x;\n  nb = a.y;\n  ob = Eb.width;\n  pb = Eb[p];\n  var b = "px";\n  o(Y[r], mb + qb + b);\n  Y[r].top = nb + rb + b;\n  o(Z[r], a.x + wb + b);\n  Z[r].top = a.y + xb + b;\n  o($[r], a.x + yb + b);\n  $[r].top = a.y + zb + b\n}\nfunction Ob(a)\n{\n  var b = a.offsetLeft, c = a.offsetTop;\n  if (a.offsetParent != null)\n  {\n    var d = Ob(a.offsetParent);\n    b += d.x;\n    c += d.y;\n  }\n  return{x:b,y:c}\n}\nfunction T(a, b, c)\n{\n  var d = "on" + b;\n  if (a.addEventListener)\n  {\n    a.addEventListener(b, c, false)\n  }\n  else if (a.attachEvent)\n  {\n    a.attachEvent(d, c)\n  }\n  else\n  {\n    var g = a[d];\n    a[d] = function()\n    {\n      var e = g.apply(this, arguments), f = c.apply(this, arguments);\n      return e == undefined ? f : (f == undefined ? e : f && e)\n    }\n  }\n};\nfunction Mb(a)\n{\n  return document.getElementById(a)\n}\nfunction Nb(a, b)\n{\n  return a.getElementsByTagName(b)[0]\n}\nEYES_init();\n</script>\n</body>\n</html>

　　变量说明：

/*
qb：遮挡图片横坐标
rb：遮挡图片纵坐标
sb：左眼图片横坐标
tb：左眼图片纵坐标
ub：右眼图片横坐标
vb：右眼图片纵坐标
-----
wb：左眼图片初始横坐标
xb：左眼图片初始纵坐标
yb：右眼图片初始横坐标
zb：右眼图片初始纵坐标
-----
Ab：眼睛运动范围（椭圆形）横轴长度
Bb：眼睛运动范围（椭圆形）纵轴长度
-----
Cb：作用不详，保持默认即可
Db：眼睛鼠标运动的灵敏程度
-----
Fb：logo图片地址
Y.src：遮挡眼睛的图片地址
Z.src：眼睛的图片地址
*/

如果你有好的win10资讯或者win10教程，以及win10相关的问题想要获得win10系统下载的关注与报道。
欢迎加入发送邮件到657025171#qq.com(#替换为@)。期待你的好消息！

文章目录