浏览器中灵活的HTML映射

我正在尝试在一个新项目中构建响应性HTML设计。除了HTML地图，一切都很好。我发现了动态生成HTML地图和背景PNG图像的方法，因此服务器端的灵活性不是问题。但是有没有一种方法可以获得客户端灵活性（通过CSS、HTML或JS）

我再次回答我自己的问题）也许我的解决方案对某人有用

<script type="text/javascript">
    GLOBAL_ARRAYCOORDS= new Array();
    GLOBAL_WIDTH=1;
    GLOBAL_ARRAYAREAS= new Array();

    function getglobal(){ 
        GLOBAL_ARRAYAREAS = document.body.getElementsByTagName("AREA");
        GLOBAL_WIDTH= 600; //document.getElementById("mapimage").naturalWidth;
        for(var i = 0; i < GLOBAL_ARRAYAREAS.length; i++) {
            GLOBAL_ARRAYCOORDS[i]= GLOBAL_ARRAYAREAS[i].coords;
        }
    }

    function scaleArea() {   
        for(var i = 0; i < GLOBAL_ARRAYAREAS.length; i++) {
            ii=i+1;
            rescale= document.getElementById("mapimage").width/GLOBAL_WIDTH ;
            sarray=GLOBAL_ARRAYCOORDS[i].split(",");      
            var rarray =new Array();
            for(var j = 0; j < sarray.length; j++) {
                rarray[j]=parseInt(sarray[j])*rescale;  
                rarray[j]=Math.round(rarray[j]);
            }
            GLOBAL_ARRAYAREAS[i].coords=rarray.join(",");
        }
    }

    window.onresize = function() {
        scaleArea();
    };
</script>

<img src="/catalog/europe.png" id="mapimage" usemap="#sueurope" onload="getglobal(); scaleArea();" />
<map id="sueurope" name="sueurope">
    <area alt="ru" coords="296,1, 296,8, ..." href="/catalog/ru" shape="poly"/>
    <area ...
</map>

全局_ARRAYCOORDS=新数组（）；
全局_宽度=1；
全局_ARRAYAREAS=新数组（）；
函数getglobal（）{
GLOBAL_ARRAYAREAS=document.body.getElementsByTagName（“区域”）；
GLOBAL_WIDTH=600；//document.getElementById（“mapimage”）.naturalWidth；
对于（变量i=0；i. 
 你所说的“HTML地图”是什么意思？你能提供一个你希望它看起来像什么的例子吗？也许是另一个网站上的一个例子？这是地理地图还是图像地图或站点地图？对不起，我想它必须足够清晰。。。这里有一个类似的问题，你可能想读一下，是的，就是这样。目前我认为JS是我唯一的解决方案。。。