jquery可鼠标拖动调整DIV元素宽度插件

使用方法

$(document).ready(function () {

                $("#frameresizer").attr("src", "frameresizers.html");
                //var frameResizer = new oyoresizer("#frameresizer", 200, 1000);
                //frameResizer.resizeMargin = 30;

                var parentdiv = $("#resizable1");
                for (i = 0; i < 30; i++) {
                    var div = document.createElement("div");
                    $(div).html("Ipsem solorem.");
                    $(parentdiv).append(div);
                }

                var resizables = new oyoresizer(".resizable");
                resizables.setSize(200, 800);

                var resizable1 = new oyoresizer("#resizable1");
                resizable1.setSize(350, 700);
                resizable1.resizeMargin = 10;

                var resizable2 = new oyoresizer("#resizable2");
                resizable2.setSize(200, 800);

                var buiten = new oyoresizer("#buiten");
                buiten.setSize(240, 500);

                var binnen = new oyoresizer("#binnen");
                binnen.setSize(140, 300);

                $("img").attr("draggable", false);
                var img = new oyoresizer("img", 65, 300);

                $("#frame1").contents().find("head").append("<style></style>");
                $("#frame1").contents().find("style").append("*{box-sizing:border-box}");
                $("#frame1").contents().find("style").append("body{margin:0px;padding:0px}");
                $("#frame1").contents().find("style").append("#wrapper{height:100%;overflow:scroll;border:0px solid black}");
                $("#frame1").contents().find("style").append("::-webkit-scrollbar {height:10px;width:10px}");
                $("#frame1").contents().find("style").append("::-webkit-scrollbar-thumb {background:white;border:2px solid black;border-radius:4px}");
                $("#frame1").contents().find("body").append("<div style='height:500px;width:540px;padding:4px'>This is a test.</div>");

                $("#frame2").attr("src", "https://demo.kuli8.com/htm5_videoplayer_ckin/ckin.mp4");

                var frameresizer1 = new oyoresizer("#frame1");
                frameresizer1.setSize(200, 600);

                var frameresizer2 = new oyoresizer("#frame2");
                frameresizer2.setSize(200, 600);
                frameresizer2.resizeMargin = 25;

                $("button").click(function () {
                    var order = $(".oyowrapper1").css("order");
                    if (order === "0") {
                        $(".oyowrapper1").css("order", "1");
                        $(".oyowrapper2").css("order", "0");
                    } else {
                        $(".oyowrapper1").css("order", "0");
                        $(".oyowrapper2").css("order", "1");
                    }
                });

});