javascript簡寫效果“神秘的眼睛”

更新時間：2008年02月27日 22:39:48 作者：

“眼睛跟隨鼠標轉(zhuǎn)動效果”—— 265.com 把它放在網(wǎng)頁的LOGO里，用javascript來實現(xiàn)，這個創(chuàng)意不錯！以前剛做FLASH的時候，用AS1實現(xiàn)過，今天下班早，在家簡寫了個：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> <title>www.fzitv.net神秘的眼睛腳本之家</title> <style type="text/css"> .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%; } </style> </head> <body> <div   class="wppm3vysvbp"   id="leftEye" class="eye">○<span id="leftPupil" class="pupil">●</span></div> <div   class="wppm3vysvbp"   id="rightEye" class="eye">○<span id="rightPupil" class="pupil">●</span></div> <input name="" id="xy" type="text" />  </body> </html>

[Ctrl+A 全選注:引入外部Js需再刷新一下頁面才能執(zhí)行]

您可能感興趣的文章:

javascript實現(xiàn)抽獎程序的簡單實例
下面小編就為大家?guī)硪黄猨avascript實現(xiàn)抽獎程序的簡單實例。小編覺得挺不錯的，現(xiàn)在就分享給大家，也給大家做個參考。一起跟隨小編過來看看吧
2016-06-06
利用原生JS實現(xiàn)data方法示例代碼
這篇文章主要給大家介紹了關于如何利用原生JS實現(xiàn)data方法的相關資料，文中通過示例代碼介紹的非常詳細，對大家學習或者使用原生JS具有一定的參考學習價值，需要的朋友們下面來一起學習學習吧
2019-05-05
微信小程序swiper實現(xiàn)文字縱向輪播提示效果
這篇文章主要介紹了微信小程序swiper實現(xiàn)文字縱向輪播提示效果，本文通過實例代碼給大家介紹的非常詳細，具有一定的參考借鑒價值,需要的朋友可以參考下
2020-01-01
JS調(diào)用Android、Ios原生控件
本文主要介紹了JS調(diào)用Android、Ios通信的相同點和不同點，以便幫助我們在進行混合式開發(fā)時，提高代碼質(zhì)量，實現(xiàn)兩者在網(wǎng)頁端代碼的統(tǒng)一。下面跟著小編一起來看下吧
2017-01-01
JavaScript中sharedWorker 實現(xiàn)多頁面通信的實例詳解
這篇文章主要介紹了JavaScript中sharedWorker 實現(xiàn)多頁面通信,通過給大家介紹的非常詳細，對大家的學習或工作具有一定的參考借鑒價值，需要的朋友可以參考下
2021-04-04
9102了，你還不會移動端真機調(diào)試嗎
這篇文章主要介紹了9102了，你還不會移動端真機調(diào)試嗎，本文詳細的介紹了3種移動端真機調(diào)試方法，具有一定的參考價值，感興趣的小伙伴們可以參考一下
2019-03-03
使用apply方法處理數(shù)組的三個技巧[譯]
本文要講的是使用apply方法處理數(shù)組的三個技巧，需要的朋友可以參考下
2012-09-09
原生js實現(xiàn)省市區(qū)三級聯(lián)動代碼分享
這篇文章主要介紹了原生js實現(xiàn)省市區(qū)三級聯(lián)動功能以及代碼分享，對此有需要的朋友可以參考學習下。
2018-02-02
TypeScript中的交叉類型和聯(lián)合類型示例講解
交叉類型簡單來說就是通過&符號將多個類型進行合并成一個類型，然后用type來聲明新生成的類型，聯(lián)合類型和交叉類型比較相似，聯(lián)合類型通過|符號連接多個類型從而生成新的類型，本文就這兩個類型結(jié)合示例代碼詳細講解，感興趣的朋友跟隨小編一起學習吧
2022-12-12
JavaScript?Promise執(zhí)行流程深刻理解
這篇文章主要介紹了JavaScript?Promise執(zhí)行流程深刻理解，他是一個構造函數(shù)，每個創(chuàng)建的promise都有各自狀態(tài)和值，且狀態(tài)初始值為pending，值為undefined
2022-06-06