很多人都注意到 google 个性首页上的 谷歌眼睛 了吧?怎么样,很有趣吧?那么它是如何 代码实现 的呢?
来,让 风过无痕 为您讲解一下 谷歌眼睛 是如何实现的……
谷歌Google眼睛需要下面的 代码文件:
两个js文件: google-eye.js eye.js
一段CSS样式代码:
<style>
#EYES_pupil0__MODULE_ID__,#EYES_pupil1__MODULE_ID__ {
position:relative;
width:15px;
height:15px;
left:52px;
top:52px;
}
</style>
#EYES_pupil0__MODULE_ID__,#EYES_pupil1__MODULE_ID__ {
position:relative;
width:15px;
height:15px;
left:52px;
top:52px;
}
</style>
一段显示用HTML代码:
<table style='border:1px solid #ccc' align=center cellpadding=0 cellspacing=0 frame=void rules=none>
<tr>
<td background="http://www.fengzhizi.cn/IMAGE/webPages/google-eye/eye-r.gif">
<div style="width:117px;height:117px;">
<img src="http://www.fengzhizi.cn/IMAGE/webPages/google-eye/pupil.gif" id="EYES_pupil0__MODULE_ID__">
</div>
</td>
<td background="http://www.fengzhizi.cn/IMAGE/webPages/google-eye/eye-y.gif">
<div style="width:117px;height:117px;">
<img src="http://www.fengzhizi.cn/IMAGE/webPages/google-eye/pupil.gif" id="EYES_pupil1__MODULE_ID__">
</div>
</td>
</tr>
</table>
<tr>
<td background="http://www.fengzhizi.cn/IMAGE/webPages/google-eye/eye-r.gif">
<div style="width:117px;height:117px;">
<img src="http://www.fengzhizi.cn/IMAGE/webPages/google-eye/pupil.gif" id="EYES_pupil0__MODULE_ID__">
</div>
</td>
<td background="http://www.fengzhizi.cn/IMAGE/webPages/google-eye/eye-y.gif">
<div style="width:117px;height:117px;">
<img src="http://www.fengzhizi.cn/IMAGE/webPages/google-eye/pupil.gif" id="EYES_pupil1__MODULE_ID__">
</div>
</td>
</tr>
</table>
查看效果
![]() | ![]() |
风过无痕 提供的全部代码如下:
文章 谷歌眼睛如何代码实现 源自 风过无痕 ,转载请注明,谢谢

