缩放功能

我的页面上有一张静态背景图片。有一个工具栏，我可以在上面讨论的静态背景图像上拖放图像。现在我需要能够缩放背景图像，但同时拖放到这个背景图像顶部的图像也应该放大并相应地移动它们的位置，看起来好像它只是一个单一图像我正在工作。我只需要为IE浏览器做这项工作。我已经尝试了-ms-zoom，但拖放的图像似乎根本不会改变它们的位置，因为它们是绝对定位的。内置缩放浏览器似乎工作完美，但我们的客户需要页面上的自定义链接放大和缩小，因为我们只需要页面的特定部分进行缩放，而不是整个页面。缩放功能

有什么办法可以达到这个要求吗？

来源

2012-08-30 Karan

分享到jsfiddle.com并在几分钟内得到答案和upvotes – Sami

一个简单的zoom应该像你所描述的那样工作。试试这个：

<script> 
a=100; 
</script> 
</head> 
<body> 
<div id="div" style="position:absolute;z-index:-1;top:50px;left:0px;width:400px; 
    height:400px;background:url(some_image.jpg)" 
> 
    <img src="another_image.png" style="position:absolute; top:50px;left:50px;" /> 
</div> 
<button onclick="a+=50;document.getElementById('div').style.zoom=a+'%';"> 
Zoom 
</button>

来源

2012-08-30 19:23:44 Teemu

Thanksssss很多!!!它工作完美。在IE8上它的行为有所不同。可能是IE8的错误？ – Karan

@ user984369我无法在IE8中重现任何不同的行为，但我只能在IE9中模拟IE8。上面的代码似乎在IE9中的每个浏览器模式都可以正常工作。此外，我在过去使用过真正的IE8中的“zoom”，并没有任何问题。也许这是你的代码中的其他东西？ – Teemu

那么在一些IE8浏览器中，它似乎工作，有些则不。 Anywas的代码真的很有用，由你提供。非常感谢。 – Karan

回答

相关问题