JQuery изменения размера не работает в FireFox, Chrome и Safari

Question

$("#dvMyDIV").bind("resize", function(){ 
    alert("Resized"); 
}); 

или

$("#dvMyDIV").resize(function(){ 
    alert("Resized"); 
}); 

Вопросы

1. Почему это не работает в FireFox, Chrome и Safari?
2. Может ли это считаться ошибкой jQuery, поскольку размер не обрабатывается для других браузеров?
3. Могло ли обходным путем вызывать функцию SetTimeout, проверяющую clientHeight и clientWidth?
4. Любые способы обхода использования jQuery?

Answer 1

Я считаю, что событие изменения размера JavaScript относится только к рамкам или окнам, а не к DIV.

например. см. this page:

Обработчик данных onResize используется для выполнения заданного кода всякий раз, когда пользователь или сценарий изменяет размер окна или фрейма. Это позволяет запрашивать размер и положение элементов окна, динамически сбросить SRC свойства и т.д.

Так что, если вы хотите, чтобы обнаружить, когда при изменении размера окна, в Jquery вы должны, вероятно, использовать $(window).resize(function() { });

Редактировать :, если вы хотите посмотреть размер DIV, это зависит от вашего намерения. Если вы изменяете размер с помощью JavaScript, вы можете реализовать метод для выполнения изменения размера и иметь этот дескриптор, вызывающий любой другой код изменения размера.

В противном случае, если вы просто смотрите, как DIV изменит размер, когда кто-то изменит размер окна, не будет ли это просто работать, чтобы прикрепить слушателя изменения размера к окну, а затем проверить, было ли изменено DIV (т.е. старые значения ширины/высоты и проверить их при изменении размера)?

Наконец, вы можете рассмотреть возможность использования watch свойств ширины и высоты, хотя я не знаю, полностью ли это совместимо с браузером (думаю, это может быть только Mozilla). Я нашел this jQuery plugin, который выглядит так, как будто он может сделать то же самое (хотя и с некоторыми небольшими изменениями).

Answer 2

Почему вы ожидаете изменения размера #dvMyDIV? Возможно, изменение размера этого элемента является результатом чего-то другого, возможно, изменение размера окна? Если это так, попробуйте

$(window).resize(function(){alert("Resized");}); 

Answer 3

я мог бы предложить что-то вроде этого:

1) на странице загрузки, получить ширину вашего DIV и поместить его в глобальную переменную

2) на выполнение любой операция напрямую или неявно изменяет размер этого div (который, как я полагаю, является событием, управляемым javascript), проверьте новую ширину на ширину старой и обновите глобальное значение с новой шириной.

Answer 4

Вы пытаетесь установить myDiv на определенный размер?

Воспользуйтесь приведенным ниже кодом JavaScript.Я использовал его для изменения размера div, который содержит флэш-объект, основанный на высоте, возвращаемой из флеш-файла, и, похоже, для меня это хорошо.

function setMovieHeight(value) { 
    var height = Number(value) + 50; 
document.getElementById("video").height = height; 
} 

equivilent JQuery должен быть:

function setHeight(value) { 
    var height = number(value) + 50; 
    $('#MyDiv').attr('height') = height; 
} 

изменение размера, похоже, только применить к объекту окна.

Answer 5

Вот еще более утонченный и живой пример, который делает много изменений в математике на основе события изменения размера окна. Работает блестяще в ff 3.6, сафари 4.0.4 и хром. Это немного коротко в 3.5. Таким образом, он должен работать в mozilla и webkit через доски. Я избегаю другого БРАУЗЕРА, потому что мне это действительно не нравится, и код настолько чище, без необходимости его рассматривать. Я понимаю, что мне придется преодолеть это, я проглотил его, когда мне нужно, и надбавку IE.

ИНАЧЕ ссылка:

http://fridaydev.com/bookmap/proport3.html

Answer 6

Это не вопрос ПОЧЕМУ? Это требование, как и в случае, мы хотим контролировать DIV, когда он изменяется.

Наглядный пример, пользовательский интерфейс jQuery, изменяемый по размеру. Да, пользователь изменил размер div с помощью мыши, теперь что? Возможно, содержимое внутри изменяется, и мы хотим знать об этом. И должен ли мы иметь весь код в гигантском плавильном котле в исходном коде для прокрутки? Я так не думаю.

Еще один быстрый браузер, который ничего не делает, вздыхает.

Answer 7

С MSIE все работает отлично. С Firefox, я думаю, вам придется прибегать к некоторым наклонным методам, таким как сохранение исходной ширины/высоты элемента в пользовательских свойствах и использование $(elem).bind('DOMAttrModified', func). Затем в обратном вызове func() проверьте, отличаются ли новые ширина/высота от ранее сохраненных вами значений, выполните соответствующее изменение размера и сохраните их снова для последующего обратного вызова. Обратите внимание, что этот подход работает только для Firefox. Мне пока не удалось найти подходящее решение для Chrome, Safari и Opera. Может быть, с помощью window.setInterval() будет делать, но ... звучит слишком slopy ... событие мысль об этом заставляет меня своего рода больной :(

Answer 8

Существует benalman плагин для этого :)

http://benalman.com/projects/jquery-resize-plugin/