jQuery - 將圖像縮放到指定位置

以下是我的要求：我有一個應顯示圖像（JPEG）的DIV。當頁面呈現時，該div應該以指定的縮放係數將圖像顯示在圖片上指定的位置（點）。圖片應該放在這個DIV裏面（不能超過DIV邊距）。在此DIV上，圖像可以（在初始縮放之後）移動/平移（通過鼠標或滾動條）並放大和縮小（通過鼠標滾輪，按鈕，滑塊或任何方法）。在某些事件中，DIV應該顯示（聚焦）圖像的另一個點（相同或其他縮放因子）。圖像在某些事件中會改變。當焦點從一個點切換到另一個點時（但在同一頁面上），我不想重新加載圖片，以防萬一圖像源發生變化。jQuery - 將圖像縮放到指定位置

我發現了類似的在這裏，但不是很接近我的要求的東西： http://www.htmldrive.net/items/show/394/JQuery.iviewer-zoom-image-and-to-drag-effect

我提到我在javascript中的新手，對其中任何部分要求任何幫助超過歡迎。如果你知道一個可以做到這一點的（免費）插件，請告訴我。

感謝您的寶貴時間，你把我的問題

來源

2012-06-20 donna

你想讓我們出示**全**代碼嗎？ – Cranio

每個需求的例子（或鏈接到一個）將綽綽有餘......我會把它們放在一起。就像我說的，我是一個新手，沒有起點。謝謝 – donna

在上述IVIEWER插件仔細一看後，我發現，它也包括在指定點位置的圖像的moveTo方法，所以IVIEWER包括我所有的要求。

來源

2012-06-27 13:08:51 donna

一些關於IVIEWER（https://github.com/can3p/iviewer）的moveTo功能的說明（來自作者）：它將容器上的點指向並將其移動到中心。例如。 moveTo（0,0）將取出圖像的左上角可見像素並將其放置在中心。如果用戶想要移動圖像，他可以使用函數setCoords來代替。請注意，setCoords函數可能需要負面的參數。也許這對別人有幫助... – donna

jQuery - 將圖像縮放到指定位置

回答

相關問題