1. 程式人生 > >圖片熱點連結的設立方法

圖片熱點連結的設立方法

圖片熱點連結的設定方法

一、熱點的原理

圖片通過usemap=”#Map”屬性將名稱為”Map”的熱點區域及連線對映到圖片上。

一般來說,圖片的usermap屬性對應的是map熱點的name的屬性值。所以如果頁面中如果有多個圖片新增熱點,那麼每一個圖片的usemap值跟對應的熱點地圖的name值一定要一樣,且不同的熱點區域name值不可以相同,如果相同,那麼圖片上的熱點區域將會以相同名稱的第一個熱點區域為準。

二、要設定圖片的熱點連結要用到三種標籤:

1、shape:定義熱點形狀

shape=rect: 矩形
shape=circle:圓形
shape=poly: 多邊形

2、coords: 定義區域點的座標

a.矩形:必須使用四個數字,前兩個數字為左上角座標,後兩個數字為右下角座標
例:

b.圓形:必須使用三個數字,前兩個數字為圓心的座標,最後一個數字為半徑長度
例:

c.任意圖形(多邊形):將圖形之每一轉折點座標依序填入
例:

三、例項


/其中 onFocus=”this.blur()” 表示去掉虛線框 /