在一張上加熱點區域可以通過標籤來實現,也可以直接使用匯出的 svg 檔案直接完成熱點區域的繪製。
通過標籤的方法:https://
1、需要先將所需大圖示注出可點選區域後,匯出為svg檔案,嵌入當前html檔案中。
<body
oncopy
="return false"
oncut
="return false"
onselectstart
="return false"
oncontextmenu
="return false"
ondragstart
="return false"
>
<
div
class
="content"
>
<
svg
id="svgrootdom"
xmlns
=""xmlns:xlink
=""preserveaspectratio
="xminymin meet"
width
="5522"
height
="1376"
viewbox
="0,0,5522,1376"
>
<
defs
>
<
style
>
.cls-1, .cls-2
.cls-2
style
>
defs
>
<
image
id="背景"
。。。更多區域省略
<
path
onclick
="clickitem('m053','000')"
id="_8-6"
data-name
="8-6"
class
="cls-1"
d="m5153.13,1128.25h188.14v213.72h5153.13v1128.25z"
/>
svg>
div>
body
>
2、新增相應的js控制繪製區域的縮放
3、在html中,用image引入原資訊作為背景
<image
id="背景"
web設定div的顏色 web前端小白科普集
每乙個寫前端的人都有不同的故事.但是都是基礎從零開始.實習公司用的框架也好,網上查到的例子也好,都是需要基礎才可以看懂的.那基礎是什麼呢,我覺得就是常用的前端的一切.我剛寫前端三個月.整理一下自己學到的知識.html是world wide web上統一的語言。指的是超文字標記語言 hyper tex...
通過js在web前端增加水印
展示效果 前面頁面新增此方法 settings functionwatermark settings 採用配置項替換預設值,作用類似jquery.extend if arguments.length 1 typeofarguments 0 object for keyinsrc varotemp d...
web前端學習 CSS樣式設定技巧
一 水平居中設定 在實際工作中常會遇到需要設定水平居中的場景,比如為了美觀,文章的標題一般都是水平居中顯示的。我們將其分為兩種情況 行內元素和塊狀元素,塊狀元素裡面又分為定寬塊狀元素,以及不定寬塊狀元素。1.行內元素 如果被設定元素為文字 等行內元素時,水平居中是通過給父元素設定text align...