1

我正在尝试执行一些操作，即在灯箱之类的东西中查看大图像，但分辨率很高，比如说 1200x1600 或更大，我的想法是查看绝对宽度和高度为 800x600 的灯箱，并且图像将是可拖动的/Moveable inside 我认为这是可能的，但是有没有现成的 Jquery 插件可以解决这个问题？或者，如果我要制作自己的自定义灯箱，您能否给我一个关于如何使其可在 Div 内拖动的提示。

4

2 回答 2

2

一个小脚本将执行此操作。请阅读这篇文章。我创建了一个小小提琴来尝试这个，它工作得很好。它可以很容易地包含在您的自定义灯箱中。以下是稍加修改的原始代码

<script type='text/javascript' src="scripts/jquery-1.9.1.js"></script>
<script type="text/javascript" src="scripts/jquery-ui.js"></script>

<script type="text/javascript">

    $(document).ready(function() {

        $("img").draggable({ containment: [-500, -422, 0, 0], scroll: false });

    });

</script>

<style type="text/css">
    div {
        width:500px; 
        height:423px; 
        position:relative; 
        overflow:hidden;
    }
</style>

HTML 是：

<div>
        <img src="http://megapack.ca/wp-content/uploads/2012/06/High-Resolution-Wallpapers-2.jpg" width="1000" height="845" alt="Map" />
</div>
于 2013-02-28T12:04:55.650 回答
1

试试 JQ Zoom，正如我在评论中提到的http://www.mind-projects.it/projects/jqzoom/

如果 JQZoom 不符合您的需求，您也可以查看更多插件

http://www.tripwiremagazine.com/2012/12/jquery-image-zoom.html

于 2013-02-28T11:46:45.880 回答