標籤:hello 位置 plane htm ref 分享 eve 拖動 lan
有時候需要在一張圖片上設定幾個地區,滑鼠點擊圖片的不同地區可以進入不同的頁面,或者是點擊圖片的某一塊地區進入某一個頁面,這就是網頁的熱點連結。
1 <img 2 src="/i/eg_planets.jpg" 3 border="0" usemap="#planetmap" 4 alt="Planets" /> 5 6 <map name="planetmap" id="planetmap"> 7 8 <area 9 shape="circle"10 coords="180,139,14"11 href ="/example/html/venus.html"12 target ="_blank"13 alt="Venus" />14 15 <area16 shape="circle"17 coords="129,161,10"18 href ="/example/html/mercur.html"19 target ="_blank"20 alt="Mercury" />21 22 <area23 shape="rect"24 coords="0,0,110,260"25 href ="/example/html/sun.html"26 target ="_blank"27 alt="Sun" />28 29 </map>
注釋:<img> 中的 usemap 屬性可引用 <map> 中的 id 或 name 屬性(由瀏覽器決定),所以我們需要同時向 <map> 添加 id 和 name 兩個屬性
那麼,如何擷取這個座標值呢?
方法一:.建立一個html頁面,在body裡面插入如下代碼:
<a href="hello.html"><img src="../picture/45.jpg" width="104" height="142" ismap /></a>
注意這個“ismap=’ismap‘”,有了這個屬性後,然後開啟這個html頁面,把游標移到圖片上任意位置,網頁的左下角狀態列會顯示當前座標值
方法二:
開啟Dreamwever,建立一個頁面,插入一張圖片,
點擊“矩形”或其他熱點工具,再在圖片上拖動位置
再開啟代碼地區
這個已經都產生好了。
轉載:http://www.cnblogs.com/haocool/p/3175691.html
網頁圖片熱點連結以及座標值