Flexigrid Plugin - Изменить положение панели изменения размера и движения мыши

Question

Я пытаюсь использовать таблицу flexigrid, проблема в том, что я не хочу, чтобы она была вверху или в середине моей страницы, но внизу.

Так что мне нужно переместить полосу изменения размера с нижней части таблицы на верх и изменить движения изменения размера (так как эта таблица, кажется, была создана для размещения только в верхней части страницы, потянув за полосувниз увеличивает div и подтягивание / увеличение делает его меньше, мне нужно это наоборот).

Я некоторое время искал решение для этого и не сталкивался с чем-то, что даже решает эту проблему,Если возможно, я бы хотел сделать это, не внося изменений в плагин flexigrid (если это невозможно, тогда это нормально).

(я использую код прямо с сайта flexigrid, но опубликую простона случай, если что-то не так или я могу просто добавить туда немного кода, чтобы это исправить)

$(document).ready(function(){
    $("#sentaku_results").flexigrid({
        //url: 'post2.php',
        //dataType: 'json',
        colModel : [
            {display: 'Count', name : 'column1', width : 100, sortable : true, align: 'center'},
            {display: '地図', name : 'column2', width : 100, sortable : true, align: 'center'},
            {display: '大字名', name : 'column3', width : 100, sortable : true, align: 'center'},
            {display: '小字名', name : 'column4', width : 100, sortable : true, align: 'center'},
            {display: '本番', name : 'column5', width : 100, sortable : true, align: 'center'},
            {display: '枝番', name : 'column6', width : 100, sortable : true, align: 'center'},
            {display: '孫番', name : 'column7', width : 100, sortable : true, align: 'center'},
            {display: 'ひ孫番', name : 'column8', width : 100, sortable : true, align: 'center'},
            {display: '所有者氏名', name : 'column9', width : 220, sortable : true, align: 'center'}
        ],
        buttons : [
            //{name: 'Add', bclass: 'add', onpress : test},
            //{name: 'Delete', bclass: 'delete', onpress : test},
            {separator: true},
            {name: 'A', onpress: sortAlpha},
            {name: 'B', onpress: sortAlpha},
            {name: 'C', onpress: sortAlpha},
            {name: 'D', onpress: sortAlpha},
            {name: 'E', onpress: sortAlpha},
            {name: 'F', onpress: sortAlpha},
            {name: 'G', onpress: sortAlpha},
            {name: 'H', onpress: sortAlpha},
            {name: 'I', onpress: sortAlpha},
            {name: 'J', onpress: sortAlpha},
            {name: 'K', onpress: sortAlpha},
            {name: 'L', onpress: sortAlpha},
            {name: 'M', onpress: sortAlpha},
            {name: 'N', onpress: sortAlpha},
            {name: 'O', onpress: sortAlpha},
            {name: 'P', onpress: sortAlpha},
            {name: 'Q', onpress: sortAlpha},
            {name: 'R', onpress: sortAlpha},
            {name: 'S', onpress: sortAlpha},
            {name: 'T', onpress: sortAlpha},
            {name: 'U', onpress: sortAlpha},
            {name: 'V', onpress: sortAlpha},
            {name: 'W', onpress: sortAlpha},
            {name: 'X', onpress: sortAlpha},
            {name: 'Y', onpress: sortAlpha},
            {name: 'Z', onpress: sortAlpha},
            {name: '#', onpress: sortAlpha}
        ],
        searchitems : [
            {display: 'Count', name : 'column1'},
            {display: '地図', name : 'column2'},
            {display: '大字名', name : 'column3'},
            {display: '小字名', name : 'column4'},
            {display: '本番', name : 'column5'},
            {display: '枝番', name : 'column6'},
            {display: '孫番', name : 'column7'},
            {display: 'ひ孫番', name : 'column8'},
            {display: '所有者氏名', name : 'column9', isdefault: true}
        ],
        sortname: "Count",
        sortorder: "asc",
        usepager: true,
        title: '土地情報検索結果',
        useRp: true,
        rp: 10,
        showTableToggleBtn: true,
        width: $('#search_results').innerWidth(),
        height: 50
    }); 
});
function sortAlpha(com){ 
    $('#flex1').flexOptions({newp:1, params:[{name:'letter_pressed', value:com}, {name:'qtype',value:$('select[name=qtype]').val()}]});
    $("#flex1").flexReload(); 
}
function test(com,grid){
    if (com=='Delete'){
        if($('.trSelected',grid).length>0){
            if(confirm('Delete ' + $('.trSelected',grid).length + ' items?')){
                var items = $('.trSelected',grid);
                var itemlist ='';
                for(i=0;i<items.length;i++){
                    itemlist+= items[i].id.substr(3)+",";
                }
                $.ajax({
                    type: "POST",
                    dataType: "json",
                    url: "delete.php",
                    data: "items="+itemlist,
                    success: function(data){
                        alert("Query: "+data.query+" - Total affected rows: "+data.total);
                        $("#sentaku_results").flexReload();
                    }
                });
            }
        }
        else{
            return false;
        }
    }
    else if(com=='Add'){
        alert('Add New Item Action');
    }
}

(извиняюсь, если это тривиальный вопрос; я не привык использовать плагины jQuery / jQuery)

Спасибо за вашу помощь

Обновление: Мне удалось переместить положение вертикальной панели изменения размера вверх, изменив следующий код в файле flexigrid.js

Строка 1181 До $(g.gDiv).prepend(g.mDiv); Изменено на $(g.vDiv).after(g.mDiv);

, а затем вместо предварительного добавления заголовка Div к верхней части контейнера,Я добавляю vGrip div

Строка 1083 До $(g.bDiv).after(g.vDiv); Изменено на $(g.gDiv).prepend(g.vDiv);

Извините, что потребовалось некоторое время, чтобы обновить этот пост, былработая над несколькими другими проектами одновременно.Все еще ищите помощь в движении мыши во время изменения размера.