Изменение размера окна
Здравствуйте!
Подскажите можно ли как-то отловить событие окончания изменения размера окна? А то у меня функция должна запускаться после изменения размера, а при 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, время: 07:43. |