縮放功能

我的頁面上有一張靜態背景圖片。有一個工具欄，我可以在上面討論的靜態背景圖像上拖放圖像。現在我需要能夠縮放背景圖像，但同時拖放到這個背景圖像頂部的圖像也應該放大並相應地移動它們的位置，看起來好像它只是一個單一圖像我正在工作。我只需要爲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

回答

相關問題