我有一个将背景设置为图像的网页,例如内容页面。除此之外,还有位于顶部的不可见链接覆盖层,因此如果用户按下正确的区域,链接就会被激活。
如果页面以较小的分辨率加载背景,链接显然不会改变,但我似乎无法计算出调整大小并将叠加层移回正确位置的公式。
页面的原始大小是 1299px x 1794px
新尺寸为 512px x 707px
覆盖层的 css 是:
<section class="annotLink" style="border-width: 0px; width: 262.217px;
height: 342.867px; border-color: rgb(0, 0, 0); left: 347.126px; top: 72.379px;
position: absolute; transform: matrix(2.181, 0, 0, 2.181, -78.516, -78.516);
transform-origin: -339.126px -44.379px 0px;">
<div style="top: -4px; left: -4px; bottom: -4px; right: -4px;"
class="annotationHighlight" hidden="true"></div>
<a class="internalLink" onclick="event.preventDefault(); JumpToPage(40)"
href="javascript:void(0);" title=""></a>
</section>
感谢任何帮助,如果您需要更多信息,请直接询问。
编辑
可以看到他们在这里工作:
最佳答案
这绝对是可行的。很难用 Firebug 进行测试,但我通过在 .annotLink
上添加 transform: scale(.83)!important
设法获得了良好的比率。
用一些翻译稍微调整一下,你应该拥有它!
您甚至可以使用 Javascript 即时调整这些值。
PS:这个页面很快就会让你很头疼......:) 这么多神奇的数字......你好来自法国!
关于javascript - 根据页面大小移动和调整链接大小,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/27824303/