HTML5 -建立一个iPad地址栏放大镜与地图区域突出显示

HTML5 - building an iPad address bar magnifier with map area highlight

本文关键字：地图放大镜区域显示地址栏 iPad 建立一个 HTML5 更新时间：2023-09-26

我正在尝试构建一个例子，以突出显示iPad的html页面上的多个图像映射区域。这个想法类似于当你点击并按住移动safari地址栏时你会注意到的放大镜功能。你可以移动放大镜到一个特定的角色。我试图利用相同的用户体验来突出图像地图"多边形"区域。当我移动放大镜时，我想通过突出显示并激活这些区域来滚动这些区域。

我正在考虑使用Jquery Maphighlight插件与CSS/JS放大镜的例子http://persistent.info/files/20040508.magnifier/http://davidlynch.org/projects/maphilight/docs/

我卡住的地方是在区域之间滚动并自动突出显示它们。

我想知道是否有人做过类似于我想要实现的事情。

干杯!Sameer

我不太清楚你想要什么，但无论如何，这可能会有所帮助。

在你的CSS和标签add

中使用伪类:active

在这个演示中，我简单地使用CSS变换来模拟缩放，但它可以替换为任何你想要的。我想你会发现一个纯css选项比任何javascript更快。

http://jsfiddle.net/thurstanh/QEudm/5/

<body ontouchstart="">

cssimg:主动{-webkit-transform:规模(2,2);}