jQuery实现分隔条左右拖动功能

};
//完成分隔条左右拖动(mouseup)
function sliderHorizontalMove(e) {
var lWidth = getElCoordinate($("#divSG")[0]).left - 2;
var rWidth = $(window).width() - lWidth - 6;
$("#divLeft").css("width", lWidth + "px");
$("#divRight").css("width", rWidth + "px");
$("#divSG").css("display", "none");
};

function reinitSize() {
var width = $(window).width() - 6;
var height = $(window).height();
$("#divLeft").css({ height: height + "px", width: width * 0.75 + "px" });
$("#divS").css({ height: height - 2 + "px", width: "4px" });
$("#divSG").css({ height: height - 2 + "px", width: "4px" });
$("#divRight").css({ height: height + "px", width: width * 0.25 + "px" });
}

$(document).ready(function () {
reinitSize();

$("#divS").on("mousedown", function (e) {
$sliderMoving = true;
$("divP").css("cursor", "e-resize");
});

$("#divP").on("mousemove", function (e) {
if ($sliderMoving) {
sliderGhostMoving(e);
}
});

$("#divP").on("mouseup", function (e) {
if ($sliderMoving) {
$sliderMoving = false;
sliderHorizontalMove(e);
$("#divP").css("cursor", "default");
}
});
});

$(window).resize(function () {
reinitSize();
});

</script>
</body>
</html>

希望本文所述对大家学习jquery分隔条有所帮助。