jQuery UI可拖动的iFrame内容

时间:2012-02-07 16:25:34

标签: jquery jquery-ui iframe

基本上我有一个固定大小的IFRAME overflow: auto。 IFRAME显示给定页面。我想要实现的是能够拖动IFRAME的内容(以便可以在不使用滚动条的情况下导航内容)。这可能吗,如果是这样的话?

2 个答案:

答案 0 :(得分:0)

查看jQuery UI是否适合您。有一个可拖动的功能,以及许多其他功能,你可能最终也会想要,比如调整大小。

http://jqueryui.com/demos/draggable/

答案 1 :(得分:0)

您必须访问iframe页面才能执行此操作,滚动条不是父页面的一部分。如果您无法更改代码,我认为这是不可能的。

我试着把东西放在一起。它还不完美,但它是一个开始:

$(function() { /* drag to scroll */
    var move = $('body');
    var x, y;
    var scroll = false;
    move.mousemove(function(event) {
        if (scroll) {
            move.scrollTop(move.scrollTop() + (y - event.pageY));
            move.scrollLeft(move.scrollLeft() + (x - event.pageX));
        }
        x = event.pageX;
        y = event.pageY;
    });
    move.mousedown(function() { scroll = true; return false; });
    move.mouseup(function() { scroll = false; return false; });
});

jsfiddle示例:http://jsfiddle.net/jBdjm/