修改jqDnR源碼

來源:互聯網
上載者:User

項目需要需要多此外掛程式進一步做修改以滿足當前項目的需求,其實需求很簡單,就是在拖拉的時候限制往下的方向,固定高度,只能往左右展開或者縮小。

代碼修改如下:

/** jqDnR - Minimalistic Drag'n'Resize for jQuery.** Copyright (c) 2007 Brice Burgess <bhb@iceburg.net>, http://www.iceburg.net/* Licensed under the MIT License:* http://www.opensource.org/licenses/mit-license.php** $Version: 2012.09.23* * last modified by Cross @2012.02.08* email:mag_lee@126.com* add features:* 1. limit the child div in parent div * 2. add jqResizeWithLimitHeight function*/(function($) {$.fn.jqDrag = function(h) {return i(this, h, 'd'); };$.fn.jqResize = function(h) { return i(this, h, 'r'); };$.fn.jqResizeWithLimitHeight = function(h) { return i(this, h, 'limitHeight'); };$.jqDnR = {dnr: {}, e: 0,drag: function(v) {// 擷取父容器的絕對座標var parentX = parseInt(E.parent().offset().left); var parentY = parseInt(E.parent().offset().top); // 擷取父容器的寬度var parentW = parseInt(E.parent().css("width").split("px")[0]);var parentH = parseInt(E.parent().css("height").split("px")[0]);// 擷取子容器的相對座標var childX = parseInt(E.position().left); var childY = parseInt(E.position().top); // 擷取子容器的寬度var childW = parseInt(E.css("width").split("px")[0]);var childH = parseInt(E.css("height").split("px")[0]);if (M.k == 'd') {// 限制子容器只能在父容器中拖動E.css({left: (M.X + v.pageX - M.pX) < 0 ? 0:(M.X + v.pageX - M.pX) < parentW- M.W ? (M.X + v.pageX - M.pX):parentW - M.W, top: (M.Y + v.pageY - M.pY) < 0 ? 0:(M.Y + v.pageY - M.pY) < parentH -M.H ?(M.Y + v.pageY - M.pY):parentH - M.H });} else {// 限制子容器只能在父容器中縮放if(M.k == 'limitHeight'){E.css({width: (M.X + v.pageX - M.pX) < parentW- M.W ? Math.max(v.pageX - M.pX + M.W, 50):parentW - childX, height: 72}); return false;}else{E.css({width: (M.X + v.pageX - M.pX) < parentW- M.W ? Math.max(v.pageX - M.pX + M.W, 50):parentW - childX, height: (M.Y + v.pageY - M.pY) < parentH -M.H ? Math.max(v.pageY - M.pY + M.H, 25):parentH - childY}); return false;}}},stop: function() { E.css('opacity', M.o); $(document).unbind('mousemove', J.drag).unbind('mouseup', J.stop); }};var J = $.jqDnR, M = J.dnr,//{}E = J.e,//0i = function(e, h, k) {return e.each(function() {h = (h) ? $(h, e) : e;h.bind('mousedown', { e: e, k: k }, function(v) {var d = v.data, p = {}; E = d.e;// attempt utilization of dimensions plugin to fix IE issuesif (E.css('position') != 'relative') {p = E.position();if (!($.browser.msie && ($.browser.version == "6.0")) && (E.css('position') == 'fixed')) {p.top -= $(window).scrollTop();p.left -= $(window).scrollLeft();}}M = { X: p.left || f('left') || 0, Y: p.top || f('top') || 0, W: f('width') || E[0].scrollWidth || 0, H: f('height') || E[0].scrollHeight || 0, pX: v.pageX, pY: v.pageY, k: d.k, o: E.css('opacity')};E.css({ opacity: 0.8 }); $(document).mousemove($.jqDnR.drag).mouseup($.jqDnR.stop);return false;});});},f = function(k) { return parseInt(E.css(k)) || false; };})(jQuery); 

聯繫我們

該頁面正文內容均來源於網絡整理,並不代表阿里雲官方的觀點,該頁面所提到的產品和服務也與阿里云無關,如果該頁面內容對您造成了困擾,歡迎寫郵件給我們,收到郵件我們將在5個工作日內處理。

如果您發現本社區中有涉嫌抄襲的內容,歡迎發送郵件至: info-contact@alibabacloud.com 進行舉報並提供相關證據,工作人員會在 5 個工作天內聯絡您,一經查實,本站將立刻刪除涉嫌侵權內容。

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.