Cum să declanșezi jQuery după $(window).on('load')

15 feb. 2018, 18:08:59
Vizualizări: 7.23K
Voturi: 0

Am o pagină WordPress construită cu Elementor în care afișez 'flipbooks' (vizualizatoare PDF) folosind un plugin numit Responsive Flipbooks. Flipbook-urile sunt făcute responsive printr-o funcție JavaScript care le redimensionează ori de câte ori fereastra browserului se redimensionează (nu știu de ce, dar nu e plugin-ul meu).

Problema este că cărțile se încarcă inițial la dimensiunea cea mai mică, iar plugin-ul declanșează jQuery(window).trigger('rfbwp.resize'); la încărcarea paginii pentru a forța o redimensionare care să le facă să se potrivească ferestrei curente. Totuși, acest lucru nu funcționează în unele browsere (cel puțin în Safari și Chrome pe Mac-ul meu), ceea ce face ca flipbook-urile să rămână mici. Am descoperit că atunci când pun această linie de cod în evenimentul meu $(window).on('scroll'), flipbook-urile se redimensionează perfect când derulez pagina. Desigur, ele se redimensionează și când redimensionez fereastra, dar nu funcționează când pun acest cod în evenimentul $(window).on('load').

Acest lucru mă face să cred că elementele nu au fost încărcate corespunzător când acest eveniment este declanșat, ceea ce este ciudat, pentru că am crezut că evenimentul load al ferestrei se declanșează ultimul.

Ar putea avea legătură cu modul în care WordPress construiește o pagină, având în vedere că toate componentele vin cu propriile lor scripturi? Este adevărat că $(window).on('load') se declanșează ultimul - chiar și într-o pagină WordPress complexă?

Pagina respectivă este live la http://cdgstyle.mixrabbit.com/lookbook/

2
Comentarii

Nu mi se pare o întrebare specifică WordPress. Faptul că site-ul tău rulează pe WordPress nu o face automat o întrebare despre WordPress. Dacă "hack-ul plugin-ului" funcționează, aș sugera să întrebi autorul plugin-ului despre asta.

Beee Beee
16 feb. 2018 00:07:44

Mi s-a părut o întrebare specifică WordPress, deoarece în mod normal este clar că un $(window).on('load') ar trebui să fie ultimul lucru care se întâmplă, așa că nu înțeleg de ce nu ar funcționa. Având în vedere că WordPress încarcă o grămadă de plugin-uri, fiecare lansând propriile scripturi, am crezut că poate motivul ar putea fi modul în care WordPress construiește o pagină. Dar într-adevăr, nu am pus această întrebare în mod explicit, așa că o voi edita.

Rob Teeuwen Rob Teeuwen
16 feb. 2018 11:53:19
Toate răspunsurile la întrebare 1
0

Probabil nu are legătură cu WordPress Core - în majoritatea cazurilor, acest tip de problemă apare din cauza conflictelor între plugin-uri. Aș sugera să dezactivezi toate celelalte plugin-uri și să încerci o temă implicită, cum ar fi Twenty Seventeen. Dacă funcționează în acel moment, poți schimba tema și să testezi, apoi să activezi câte un plugin pe rând și să testezi, până când găsești ce anume creează conflictul, apoi să raportezi acest lucru autorului plugin-ului pentru a găsi o soluție.

Între timp, dacă folosești o temă implicită și doar acest plugin încă nu funcționează, iată două lucruri pe care le poți încerca în loc de $(window).on('load'):

jQuery(window).load(function($) {
   // funcția ta
});

Sau mai succint

(function($) {
  // funcția ta
})(jQuery);

WP folosește jQuery în modul no conflict - așadar, problema ar putea fi pur și simplu sintaxa $. Dacă acest lucru rezolvă problema, cel mai rapid este adesea să trimiteți o cerere de pull (pull request) către depozitul plugin-ului pentru a stimula autorul să ia măsuri.

16 feb. 2018 17:33:02