Изменение размера окна
Здравствуйте!
Подскажите можно ли как-то отловить событие окончания изменения размера окна? А то у меня функция должна запускаться после изменения размера, а при window.onresize = resize она запускается во время изменения размера |
Можно попробовать вот так
var resize = function(e){ console.log(e); }; (function(){ var time; window.onresize = function(e){ if (time) clearTimeout(time); time = setTimeout(function(){ resize(e); },1000); } })(); т.е. вызов вашей функции происходит через секунду после возникновения события resize, но каждое новое событие сбрасывает таймер снова на 1 секунду, при этом вызова функции не происходит, а как только каждое новое событие перестанет сбрасывать таймер, пройдет секунда и произойдет вызов вашей функции. Грубо говоря как только вы перестанете изменять размеры окна, через секунду после этого произойдет вызов вашей функции. Можно и меньший интервал сделать. Но это при всем при том, что вас вообще устраивает наличие небольшой задержки. |
shkoder,
спасибо, так работает, но возникла проблемка: я переделал под себя, получилось так (function() { var time1; window.onresize = function(e) { if (time1) clearTimeout(time1); time1 = setTimeout(function() {var intervalID = window.setInterval(correct, time);},700); } })(); в функции correct у меня идёт проверка условия, если верно выполняются действия, если нет clearInterval(intervalID); Но! При запуске через time1 = setTimeout(function() {var intervalID = window.setInterval(correct, time);},700); сброс не срабатывает =( из-за чего это может быть? |
FoxTrix,
window.setInterval(correct, time) параметры жирным - должны быть либо глобальными - либо явно преданы в функцию |
Deff,
correct - функция time1 = setTimeout(function(correct, time) {var intervalID = window.setInterval(correct, time);},700); так просто не работает, time1 = setTimeout(function(time) {var intervalID = window.setInterval(correct, time);},700); так тоже самое что и без time |
FoxTrix,
Вы чот не то делаете - дайте кусок Вашего скрипта вместе означимыми параметрами в текущем Вашем коде(ничо не меняя) |
Deff,
var time = 1000; var intervalID = window.setInterval(correct, time); function correct() { var widthSlide; var book1 = document.getElementById('book1').offsetLeft; var book2 = document.getElementById('book2').offsetLeft; var book3 = document.getElementById('book3').offsetLeft; var book4 = document.getElementById('book4').offsetLeft; if(условие) { действие } else { clearInterval(intervalID); setTimeout(width, 100); } } (function(time) { var time1; window.onresize = function(e) { if (time1) clearTimeout(time1); time1 = setTimeout(function(time) {var intervalID = window.setInterval(correct, time);},700); } })(); |
FoxTrix, расскажите - как оно должно работать
var time = 1000; (function(time){ console.log(time); })(); практически такой же эффект, что и var time = 1000; (function(){ var time; console.log(time); })(); >>> indefinded зачем вы в объекте вызова функции (function(){})(); объявляете time. По сути интерпритатор в цепочке объектов вызова найдет time равный undefined либо передавайте его так (function(time){ // ... })(time); т.е. когда предполагается, что значение time в дальнейшем будет меняться, но именно тут вам нужно именно первоначальное значение, например: var time = 1000; (function(time){ setTimeout(function(){ console.log(time); },1000); })(time); time = 100500; >>> 1000 и если наоборот var time = 1000; (function(){ setTimeout(function(){ console.log(time); },1000); })(); time = 100500; >>> 100500 т.е. смотря что нужно. setTimeout(function(time) {var intervalID = window.setInterval(correct, time);},700); что вы делаете? во первых: function(time) {... опять объявляете time и опять он undefined. Сам же setTimeout не передает вам в ваш колбэк никаких параметров т.е. в вашем случае time , зачем так писать var intervalID = window.setInterval(correct, time); вы не меняете значение переменной вы меняете ссылку на объект, но сам объект остается. пример: var a = setInterval(function(){ console.log(1); },1000); a = setInterval(function(){ console.log(2); },1000); >>>1 >>>2 >>>1 >>>2 ... иными словами в вашем случае при каждом resize у вас новый window.setInterval(correct, time); , при наличии предыдущих А вообще не очень понятно, что ваш код должен делать, лучше расскажите |
shkoder,
(function(time) { var time1; window.onresize = function(e) { if (time1) clearTimeout(time1); time1 = setTimeout(function(time) {var intervalID = window.setInterval(correct, time);},700); } })(); это просто тесты, я в JS 4 дня, и знания мои бессистемны, читал-узнавал только то, что нужно для конкретной задачи сейчас выглядит так (function() { var time1; window.onresize = function(e) { if (time1) clearTimeout(time1); time1 = setTimeout(function() {intervalID = window.setInterval(correct, time);},700); } })(); у меня есть скрипт при котором я могу таскать мышкой div'ы эта функция включается при onMouseUp чтобы проверить не наехал ли один div на другой, если наехал - происходит корректировка до тех пор пока наездов не останется PS: Спасибо всем за помощь, всё получилось! |
Часовой пояс GMT +3, время: 06:35. |