Javascript JQuery灯箱内部可拖动图像

Javascript JQuery灯箱内部可拖动图像,javascript,jquery,css,html,Javascript,Jquery,Css,Html,我在试着做点什么 在像lighbox这样的东西里面看大图像,但是分辨率很高,比如说1200x1600或更大,我想的是看一个绝对宽度和高度都像800x600的灯箱,图像可以在灯箱里面拖动/移动 我认为这是有可能的,但是有没有现成的Jquery插件可以做这样的事情呢? 或者,如果我要制作自己的定制灯箱,你能给我一个建议,让它在Div中可以拖动。试试JQ Zoom,就像我在评论中提到的那样 如果JQZoom不符合您的需要,您还可以检查更多插件 一个小脚本可以做到这一点。请阅读。我创建了一个微型计算机来

我在试着做点什么 在像lighbox这样的东西里面看大图像,但是分辨率很高,比如说1200x1600或更大,我想的是看一个绝对宽度和高度都像800x600的灯箱,图像可以在灯箱里面拖动/移动 我认为这是有可能的,但是有没有现成的Jquery插件可以做这样的事情呢?
或者,如果我要制作自己的定制灯箱,你能给我一个建议,让它在Div中可以拖动。

试试JQ Zoom,就像我在评论中提到的那样

如果JQZoom不符合您的需要,您还可以检查更多插件


一个小脚本可以做到这一点。请阅读。我创建了一个微型计算机来尝试这一点,它工作得非常完美。它可以很容易地包含在您的定制灯箱中。下面是经过轻微修改的原始代码

<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>

为什么不检查一下JQZOOM,谢谢,它和我想要的非常相似,我会试试看。