Question

我想在页面的选项卡上有一个可调整大小的选择器，所以我使用了Jquery UI可调整大小的组件。但我在查找所选标签的数量等方面遇到了问题。

注意：div可以从两端调整大小。

是否有任何jquery插件可以为我提供此类功能？

Answer 1

var enw = parseInt(Math.abs(newWidth / gridSize));

编辑：

我回来了一个新的更新。请查看此jsfiddle

var tabs = [];

$(document).ready(function(){

    $('.dateTab ul li').each(function(){
        var tabNo = parseInt($(this).html(),10);
        tabs.push({'no':tabNo, 'right':tabNo * ($(this).width() + 2)});
    });

    $('#dDragHandler').resizable({
        handles: 'e,w' ,
        grid: [32,32],
        distance: 28,
        maxWidth: 940,
        minWidth: 0,    
        resize: function(event, ui) {
                   },
        stop : function(event, ui) {

        var pos = $('.dateDragHandler').offset();
        var width  = $('.dateDragHandler').width()+1;
        var right = pos.right + width;

            var html = "Number of tabs selected: " + parseInt(width / 32, 10);


        for(var i = 0; i < tabs.length; i++) {
            if(tabs[i].right == pos.left) {
                html += "<br />First tab selected is: " + tabs[i + 1].no;
            }
            if(tabs[i].right == right) {
                html += "<br />Latest tab selected is: " + tabs[i].no;
            }
        }
        $('.dateInfoTab').html(html);

    }
    });
});

可调整大小的标签区域

1 个答案: