Question

我正在制作一个考试网站，我为jQuery准备了我的html，现在我想让用户在桌子的边框上抓住鼠标并拖动它时改变桌子的宽度。因为某些答案可能比我的默认位置更长。

我应该使用什么API？我猜我应该使用drag（）api但我还需要什么呢？

如果你们也能提供一些例子，我也会感激不尽：）

Answer 1

一些提示：

$(selector).width();

$(selector).mousedown(function(){});

$(selector).mouseup(function(){});

Answer 2

工作演示 http://jsfiddle.net/YfnjA/

希望它有所帮助。

当你点击并拖动它时，你可以调整大小，休息你可以玩游戏并立即按照自己的方式进行：）

<强>码

$(function() {
    var pressed;
    var start;
    var startX;
    var startWidth;
    var wrapper = $("div#wrapper");
    var container = $("table#container");

    $("table th").mousedown(function(e) {
        start = $(this);
        startX = e.pageX;
        startWidth = $(this).width();
        $(start).addClass("resizing");
        pressed = true;
    });

    $(document).mousemove(function(e) {
        if(pressed) {
            var newWidth = startWidth + (e.pageX - startX);
            start.width(newWidth);
            wrapper.width(container.width() + 10);
        }
    });

    $(document).mouseup(function() {
        if(pressed) {
            $(start).removeClass("resizing");
            pressed = false;
        }
    });
});

如何通过jQuery更改浏览器上HTML表的宽度

2 个答案: