gpt4 book ai didi

html - map 区域样式属性-位置:relative not work in my html application

转载 作者:行者123 更新时间:2023-11-28 11:37:44 25 4
gpt4 key购买 nike

在我的 aspx 文件中,我有 img 标签和与其相关的 map 标签,

<IMG id="imgLogo" src="images/baner.jpg" usemap="#map">
<map name="map" style="display:block; position:relative;">
<area id="myArea" shape=poly coords="803, 1, 952, 1, 988, 108, 840, 112" href=MainNew.aspx alt="this is a link!!"/>
</map>

当我将页面作为 Web 应用程序运行时,它工作正常,但是当我将其作为 html 应用程序运行时,区域位置不是相对的,并且会在我更改浏览器大小时移动。我该如何解决?

最佳答案

我编写了解决问题的 javascript 函数,该函数找到多边形点的相对位置:

 <body onload="function(){
var height = document.getElementById('imgLogo').height;
var width = document.getElementById('imgLogo').width;
var relativeWidth = 0.147;
var relativeTopStartPoint = 0.787;
var relativeBottomStartPoint = 0.8235;
var coords = Math.ceil(width * relativeTopStartPoint) + ',0 ,' + Math.ceil(width * relativeTopStartPoint + width * relativeWidth) + ',0 ,' + Math.ceil(width * var relativeBottomStartPoint + width * relativeWidth) + ',' + Math.ceil(height) + ' ,' + Math.ceil(width * var relativeBottomStartPoint) + ',' + Math.ceil(height);
document.getElementById('myArea').setAttribute('coords', coords);}" >
...
</body>

关于html - map 区域样式属性-位置:relative not work in my html application,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/20828019/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com