Сделал плагин на jQuery "resize" для изменения размеров DOM элементов.
И хотелось бы узнать есть ли минусы... нагрузка или что-нибудь подобное и упростить...
Суть плагина в том что он отслеживает расположение на элементе
CODE ( javascript):
скопировать код в буфер обмена
//Устанавливаем курсор $(document).on('mouseover', options.selector, function () { // Изменяем курсор на элементе $this = $(this); $(document).on('mousemove.resize', function (event) { if($this) { console.log('asd') if(event.pageX > $this.offset().left + $this.width() - options.size && event.pageY > $this.offset().top + $this.height() - options.size) cursor = 'nw-resize'; //если курсор в правом нижнем углу "nw-resize" else if(event.pageX > $this.offset().left + $this.width() - options.size) cursor = 'w-resize'; //если курсор справа на элементе "w-resize" else if(event.pageY > $this.offset().top + $this.height() - options.size) cursor = 'n-resize';//если курсор внизу элемента "n-resize" else cursor = 'default'; //если нет то стандартный $('body').css('cursor', cursor); //меняем курсор } }) }); а тут изменяем размер $(document).on('mousedown.resize', options.selector, function (event) { resize = $(this); type = false; shift = { x: event.pageX - resize.offset().left - resize.width(), y: event.pageY - resize.offset().top - resize.height(), } if(event.pageX > resize.offset().left + resize.width() - options.size && event.pageY > resize.offset().top + resize.height() - options.size) type = 'xy'; else if(event.pageX > resize.offset().left + resize.width() - options.size) type = 'x'; else if(event.pageY > resize.offset().top + resize.height() - options.size) type = 'y'; else type = false; $(document).on('mousemove.resize', function (event) { if(resize) { if(type == 'xy') resize.css({width: event.pageX - resize.offset().left+"px", height: event.pageY - resize.offset().top+"px"}); else if(type == 'x') resize.width(event.pageX - resize.offset().left); else if(type == 'y') resize.height(event.pageY - resize.offset().top); event.preventDefault(); } }) }) $(document).on('mouseup.resize', function () { // обнуляем resize = null; }) $(document).on('mouseout.resize', options.selector, function () { // курсор на стандартный $this = null; $('body').css('cursor', 'default'); })
Правильный ли код и сильно ли нагружает так как постоянно идет отслеживание курсора на элементе?
|