Jaka jest poprawna (nowoczesna) metoda podsłuchiwania zdarzenia zmiany rozmiaru okna, które działa w Firefox, WebKit i Internet Explorer?
Czy możesz włączyć / wyłączyć oba paski przewijania?
javascript
jquery
cross-browser
resize
BuddyJoe
źródło
źródło
window.dispatchEvent(new Event('resize'));
stackoverflow.com/questions/1818474/…Odpowiedzi:
jQuery ma wbudowaną metodę :
Ze względu na responsywność interfejsu użytkownika możesz rozważyć użycie setTimeout do wywołania kodu dopiero po pewnej liczbie milisekund, jak pokazano w poniższym przykładzie, zainspirowanym tym :
źródło
$('.button').on({ click: function(){ /* your code */ $(window).trigger('resize') })
źródło
Oto sposób podsłuchiwania zdarzenia zmiany rozmiaru przez użytkownika innego niż jQuery:
Działa na wszystkich nowoczesnych przeglądarkach. Czyni nie przepustnica coś dla ciebie. Oto przykład tego w akcji.
źródło
Przepraszam, że przywołałem stary wątek, ale jeśli ktoś nie chce używać jQuery, możesz użyć tego:
źródło
Ponieważ jesteś otwarty na jQuery, ta wtyczka wydaje się załatwić sprawę.
źródło
Za pomocą jQuery 1.9.1 właśnie się dowiedziałem, że chociaż technicznie identyczne) *, to nie działało w IE10 (ale w Firefox):
podczas gdy działało to w obu przeglądarkach:
Edycja :)
* W rzeczywistości nie jest technicznie identyczny, jak zauważono i wyjaśniono w komentarzach WraithKenny i Henry Blyth .
źródło
.resize()
do.bind('resize')
lub dodając anonimową funkcję? Myślę, że to druga.)adjustSize
metoda traci kontekstthis
, podczas gdy drugie wywołanieCmsContent.adjustSize()
zachowujethis
, tjthis === CmsContent
. JeśliCmsContent
instancja jest wymagana wadjustSize
metodzie, pierwszy przypadek zakończy się niepowodzeniem. Drugi przypadek będzie działał dla każdego rodzaju wywołania funkcji, dlatego zaleca się zawsze przekazywać anonimowe funkcje.jQuery
$(window).resize()
domyślnie zapewnia funkcję:źródło
Uważam, że wtyczka jQuery „zdarzenie zmiany rozmiaru jQuery” jest najlepszym rozwiązaniem, ponieważ dba o to, aby zdarzenie działało tak samo we wszystkich przeglądarkach. Jest podobny do odpowiedzi Andrewsa, ale lepszy, ponieważ można podłączyć zdarzenie zmiany rozmiaru do określonych elementów / selektorów, a także do całego okna. Otwiera nowe możliwości pisania czystego kodu.
Wtyczka jest dostępna tutaj
Jeśli dodasz dużo słuchaczy, występują problemy z wydajnością, ale w większości przypadków jest to idealne rozwiązanie.
źródło
Myślę, że powinieneś dodać do tego dodatkową kontrolę:
źródło
mam nadzieję, że pomoże to w jQuery
najpierw zdefiniuj funkcję, jeśli istnieje, przejdź do następnego kroku.
zmiana rozmiaru przeglądarki, takie jak te.
źródło
Poza wymienionymi funkcjami zmiany rozmiaru okna ważne jest, aby zrozumieć, że zdarzenia zmiany rozmiaru są uruchamiane bardzo często, jeśli są używane bez usuwania zdarzeń z zdarzeń.
Paul Irish ma doskonałą funkcję, która bardzo dobrze ogłasza wywołania zmiany rozmiaru. Bardzo polecany do użycia. Działa w różnych przeglądarkach. Przetestowałem to w IE8 innego dnia i wszystko było w porządku.
http://www.paulirish.com/2009/throttled-smartresize-jquery-event-handler/
Koniecznie sprawdź wersję demo aby zobaczyć różnicę.
Oto funkcja kompletności.
źródło