javascript изменение размера события стрельбы несколько раз, перетаскивая ручку изменения размера

Я надеялся, что этот плагин jQuery будет работать, но это не так:

http://andowebsit.es/blog/noteslog.com/post/how-to-fix-the-resize-event-in-ie (старая ссылка была noteslog.com/post/how-to-fix-the-resize -event-in-ie).

Я добавил комментарий на его сайт, но они модерируются, так что вы еще не видите его.

Но так или иначе, позвольте мне объяснить мое желание. Я хочу, чтобы событие типа «изменение размера» было запущено, когда пользователь либо приостанавливает его изменение размера, либо завершает его изменение размера, а не пока пользователь активно перетаскивает ручку изменения размера windows браузера. У меня довольно сложная и трудоемкая функция OnResizeHandled, которую мне нужно запустить, но не запускать 100 раз только потому, что пользователь расширил окно на 100 пикселей, и событие было выпущено за любой пиксель движения. Я думаю, лучше всего будет обрабатывать его, как только пользователь выполнит изменение размера.

Заимствуйте некоторые идеи из решений параллелизма для управления streamом событий, поступающих из браузера.

Например, когда вы впервые получаете событие resize, установите флаг в true, указывающий, что пользователь в настоящее время изменяет размер. Установите тайм-аут, чтобы вызвать обработчик события фактического изменения размера через 1 секунду. Затем, когда этот флаг имеет значение true, игнорируйте событие изменения размера. Затем, в фактическом обработчике, как только все будет сделано и правильно, установите флаг обратно в значение false.

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

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

Как насчет некоторого кода:

function resizeStuff() { //Time consuming resize stuff here } var TO = false; $(window).resize(function(){ if(TO !== false) clearTimeout(TO); TO = setTimeout(resizeStuff, 200); //200 is time in miliseconds }); 

Это должно гарантировать, что функция изменяет размер только тогда, когда пользователь перестанет изменять размер.

У Paul Irish есть отличный Debugg плагин jQuery, который решает эту проблему.

Если вы находитесь в библиотеках, вы должны отмечать underscore, underscore уже обрабатывает ваши потребности и многие другие, которые вы, вероятно, будете иметь в своих проектах.

вот пример того, как работает дебютщик подчеркивания:

 // declare Listener function var debouncerListener = _.debounce( function(e) { // all the actions you need to happen when this event fires }, 300 ); // the amount of milliseconds that you want to wait before this function is called again 

затем просто вызовите эту функцию debouncer при изменении размера windows.

 window.addEventListener("resize", debouncerListener, false); 

проверьте все функции подчеркивания, доступные здесь http://underscorejs.org/

Как установить время ожидания, когда пользователь приостанавливает изменение размера? Сбросьте таймаут при изменении размера или запустите обработчик события изменения размера, если истечет время ожидания.

Поскольку он построен в jQuery, не можете ли вы связать какое-то событие onComplete с расширением и передать функцию, которая должна выполняться при ее вызове?

Редактировать:

Когда пользователь начинает изменять размер windows, задайте интервал, который отслеживает размеры windows. Если размеры не изменились в течение заданного периода времени вашей спецификации, вы можете рассмотреть изменение размера windows «завершено». Ваша функция javascript выбора в этом случае будет setInterval (), которая принимает два аргумента – функцию для вызова каждого тика и продолжительность каждого тика в миллисекундах.

Что касается того, как писать это специально в рамках jquery, я не знаю достаточно о jquery, чтобы быть в состоянии сказать вам об этом. Возможно, кто-то еще может помочь вам более конкретно, но в то же время вы можете рассмотреть возможность расширения расширения jquery, которое вы уже связали с событием onComplete, которое работает, как я только что описал.

Несколько дней назад я расширил jQuery on умолчанию on обработчике событий. Он присоединяет функцию обработчика событий для одного или нескольких событий к выбранным элементам, если событие не запускалось для заданного интервала. Это полезно, если вы хотите активировать обратный вызов только после задержки, например событие изменения размера или другое. https://github.com/yckart/jquery.unevent.js

 ;(function ($) { var methods = { on: $.fn.on, bind: $.fn.bind }; $.each(methods, function(k){ $.fn[k] = function () { var args = [].slice.call(arguments), delay = args.pop(), fn = args.pop(), timer; args.push(function () { var self = this, arg = arguments; clearTimeout(timer); timer = setTimeout(function(){ fn.apply(self, [].slice.call(arg)); }, delay); }); return methods[k].apply(this, isNaN(delay) ? arguments : args); }; }); }(jQuery)); 

Используйте его, как и любой другой, или bind -event-обработчик, за исключением того, что вы можете передать дополнительный параметр в качестве последнего:

 $(window).on('resize', function(e) { console.log(e.type + '-event was 200ms not triggered'); }, 200); 

http://jsfiddle.net/ARTsinn/EqqHx/

  • Как resize изображения C #
  • можно определить размер массива во время выполнения в c?
  • Интуиция и идея перестройки 4D-массива в 2D-массив в NumPy
  • ImageView - квадрат с динамической шириной?
  • Как resize пользовательского представления программно?
  • Давайте будем гением компьютера.