是否可能创建地图html面积百分比? [英] Is possible create map html area in percentage?

查看:96
本文介绍了是否可能创建地图html面积百分比?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我需要创建如下:

http://www.mrporter.com/journal/journal_issue71/2#2

我的大图片中的每个产品都与一个工具提示相关联鼠标悬停。
但是我需要使用全屏图片

where every product in my big image is associated with a tooltip which appears on mouse hover. But I need this to work with fullscreen images.

我想的第一个解决方案(如上例)是 map html 解决方案,其中每个填充完全是我的产品的边界。
问题是我不能为我指示精确值,因为我的图片大小取决于窗口屏幕。

The first solution I thought (as the example above) is the map html solution where each fill up exactly the boundaries of my products. The problem is that I can't indicate precise values for my because my image size depends on window screen.

最佳解决方案是为我的区域设置百分比值
这是可能吗?任何其他建议?

The best solution would be the possibility to set percentage values for my area. Is this possible? Any other suggestions ?

推荐答案

使用链接的替代解决方案:

Alternative solution using links:

.image{
  position: relative;
}
.image a{
  display: block;      
  position: absolute;
}

HTML:

<div class="image">
  <img src="image.jpg" alt="image" />
  <a href="http://www.example.cz/1.html" style="top: 10%; left: 10%; width: 15%; height: 15%;">
  <a href="http://www.example.cz/2.html" style="top: 20%; left: 50%; width: 15%; height: 15%;">
  <a href="http://www.example.cz/3.html" style="top: 50%; left: 80%; width: 15%; height: 15%;">
</div>

图形编辑器可检测百分比尺寸

Percentage dimensions can be detected in graphic editors

这篇关于是否可能创建地图html面积百分比?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆