圖像熱區(qū)的小把戲彩蛋
更新時(shí)間：2008年03月22日 13:27:22 作者：
很少有人知道，其實(shí) Yahoo 中國(guó)和淘寶網(wǎng)的首頁(yè)有一個(gè)彩蛋。想親身體驗(yàn)一把的話，你可以打開(kāi)上述網(wǎng)站，全部載入完畢以后點(diǎn)擊雅虎中國(guó) Logo 的驚嘆號(hào)或者是淘寶網(wǎng) Logo 上面的“淘”字或者“寶”字上面的點(diǎn)，然后你發(fā)現(xiàn)了什么呢？
或許你很驚奇他們是怎么做到的，這就是圖像熱區(qū)（Map）的一個(gè)應(yīng)用。下面引用一段 Map 的解釋：
所謂圖像熱區(qū)，就是帶有預(yù)先定義區(qū)域的圖像，這些區(qū)域包含了指向其它文檔或錨的鏈接。
例如，你可以在一副太陽(yáng)系的圖像上創(chuàng)建用戶點(diǎn)擊后可瀏覽不同星球的鏈接。具體的詳細(xì)情況可以參考這里和這里。比如說(shuō)上述的菜單就是將一個(gè) map 定義到了首頁(yè)的 Logo 上，然后效果就是點(diǎn)擊這張圖片的一部分就執(zhí)行相應(yīng)操作（Javascript 控制）。比如：
<area shape="rect" coords="0,0,82,126" href="sun.html" alt="Sun" />就可以在熱區(qū)所定義的位置 "0,0,82,126" 打開(kāi) sun.html 的鏈接。那么 Javascript 如何控制其行為呢，其實(shí)你完全可以將 area 元素當(dāng)作 a 元素來(lái)看待，它也有 onclick 等方法。
至于是如何播放聲音的，我看了下代碼，是一個(gè)簡(jiǎn)單的 Flash 在“作怪”。之所以做成 Flash 有兩個(gè)原因，一是容量比較小，二就是兼容大部分的瀏覽器（只要裝了 Flash 的插件就可以）。
忘記那那該死的 embed 吧，它只支持 Internet Explorer，而且不是 Web 標(biāo)準(zhǔn)的一部分。Alistapart 上面有一篇文章，名叫 Bye Bye Embed，非常的精彩，建議如需要在網(wǎng)頁(yè)中插入其他元素的可以參考一下。
好了，說(shuō)了那么多，朋友你能看出來(lái)本網(wǎng)站的 Logo 有什么特殊的地方嗎（使用 Internet Explorer 的朋友就不要嘗試了）？
所謂圖像熱區(qū)，就是帶有預(yù)先定義區(qū)域的圖像，這些區(qū)域包含了指向其它文檔或錨的鏈接。
例如，你可以在一副太陽(yáng)系的圖像上創(chuàng)建用戶點(diǎn)擊后可瀏覽不同星球的鏈接。具體的詳細(xì)情況可以參考這里和這里。比如說(shuō)上述的菜單就是將一個(gè) map 定義到了首頁(yè)的 Logo 上，然后效果就是點(diǎn)擊這張圖片的一部分就執(zhí)行相應(yīng)操作（Javascript 控制）。比如：
<area shape="rect" coords="0,0,82,126" href="sun.html" alt="Sun" />就可以在熱區(qū)所定義的位置 "0,0,82,126" 打開(kāi) sun.html 的鏈接。那么 Javascript 如何控制其行為呢，其實(shí)你完全可以將 area 元素當(dāng)作 a 元素來(lái)看待，它也有 onclick 等方法。
至于是如何播放聲音的，我看了下代碼，是一個(gè)簡(jiǎn)單的 Flash 在“作怪”。之所以做成 Flash 有兩個(gè)原因，一是容量比較小，二就是兼容大部分的瀏覽器（只要裝了 Flash 的插件就可以）。
忘記那那該死的 embed 吧，它只支持 Internet Explorer，而且不是 Web 標(biāo)準(zhǔn)的一部分。Alistapart 上面有一篇文章，名叫 Bye Bye Embed，非常的精彩，建議如需要在網(wǎng)頁(yè)中插入其他元素的可以參考一下。
好了，說(shuō)了那么多，朋友你能看出來(lái)本網(wǎng)站的 Logo 有什么特殊的地方嗎（使用 Internet Explorer 的朋友就不要嘗試了）？
相關(guān)文章
站長(zhǎng)網(wǎng)seo聽(tīng)課心得總結(jié)
站長(zhǎng)網(wǎng)seo聽(tīng)課心得總結(jié)...2007-11-11
達(dá)到良好的網(wǎng)站優(yōu)化效果需要注意的十點(diǎn)小結(jié)
要達(dá)到良好的網(wǎng)站優(yōu)化效果，除了要保證足夠的高質(zhì)量原創(chuàng)內(nèi)容及廣泛建立連接提高Link Popularity外，對(duì)網(wǎng)頁(yè)進(jìn)行充分的優(yōu)化更是必需的，本文介紹了網(wǎng)站優(yōu)化效果需要注意的十點(diǎn)小結(jié)，感興趣的小伙伴們可以參考一下2007-12-12
Apache和IIS共享80端口的四個(gè)設(shè)置方法
有時(shí)候電腦同時(shí)安裝了apche和iis，而且我們需要共用80端口，你就可以測(cè)試一下下面的方法2008-09-09
做網(wǎng)站非常重要的一點(diǎn)主機(jī)性能
主機(jī)性能直接影響我們網(wǎng)站的運(yùn)行速度，如果主機(jī)性能差，我們的程序，運(yùn)行就很慢，不是網(wǎng)速的慢2008-08-08
網(wǎng)站技巧之轉(zhuǎn)發(fā)與重定向的區(qū)別
怎么選擇是重定向還是轉(zhuǎn)發(fā)呢？通常情況下轉(zhuǎn)發(fā)更快，而且能保持request內(nèi)的對(duì)象，所以他是第一選擇。2008-09-09
有感于“站長(zhǎng)們，拿出你們的尊嚴(yán)來(lái)!”而發(fā)
讀了這篇文章，深有感觸，現(xiàn)在好多朋友是這樣的了，網(wǎng)上源碼到處飛，病毒網(wǎng)站經(jīng)常見(jiàn)，為了有IP惡意造詞而又又無(wú)實(shí)質(zhì)內(nèi)容的比比皆是，一個(gè)單子你800就做，而你缺程序一點(diǎn)都不能寫(xiě)，這樣的人做出來(lái)的東西，能有多好。2007-12-12
網(wǎng)站關(guān)鍵字設(shè)置技巧放松了比較不錯(cuò)的關(guān)鍵詞設(shè)置方法
網(wǎng)站關(guān)鍵字設(shè)置技巧放松了比較不錯(cuò)的關(guān)鍵詞設(shè)置方法...2007-11-11
大家要經(jīng)常更新內(nèi)容啊-針對(duì)百度的原創(chuàng)收錄速度測(cè)試
大家要經(jīng)常更新內(nèi)容啊-針對(duì)百度的原創(chuàng)收錄速度測(cè)試...2007-11-11
現(xiàn)在很多中小網(wǎng)站(尤其是 Web 2.0 站點(diǎn)) 都允許用戶上傳圖片，如果前期沒(méi)有很好的規(guī)劃，那么隨著圖片文件的增多，無(wú)論是管理還是性能上都帶來(lái)很多問(wèn)題。2008-07-07
網(wǎng)站關(guān)鍵詞標(biāo)題和網(wǎng)頁(yè)描述撰寫(xiě)技巧
在我們的搜索引擎優(yōu)化工 作中，可能很多朋友會(huì)遇到這樣一個(gè)問(wèn)題，網(wǎng)站一些關(guān)鍵詞排名不錯(cuò)，但是點(diǎn)擊訪問(wèn)的不多，甚至有朋友曾調(diào)查過(guò)，發(fā)現(xiàn)有時(shí)候排名靠前的訪問(wèn)量比靠后的點(diǎn)擊率更 低，有些網(wǎng)站訪問(wèn)量很高，但是網(wǎng)站廣告的點(diǎn)擊率很低，產(chǎn)品銷售型網(wǎng)站也會(huì)同樣遇到這種，高訪問(wèn)量，低咨詢，低成交量的問(wèn)題。2008-03-03