踩到Window resize在Preview print的雷

最近在作案的過程中遇到一個狀況,從Art design那邊拿到的頁面,會在Window resize的時候執行某個Function,本來一切都正常,但測試到Chrome和Firefox預覽列印時發現也會Trigger這個Event,會讓在預覽列印過後的頁面發生問題,所以必須要進行修正,以下是這個案例的說明:

先在測試頁加入以下的程式,發現在預覽列印的時候會Trigger window resize event:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Preview Print Test</title>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
    <script>
        $(window).resize(function() {
            console.log("Window Resize");
        });
    </script>
</head>
<body>
<h1>Window Resize Test</h1>
</body>
</html>
Preview print trigger window resize event
Preview print trigger window resize event

網路上搜尋了一下解決方案,將Script改寫如下,可以順利解決,但不知道是不是最好的方法,如果大家有更好的也別忘了告訴我唷~

openResizeFn();

// Chorme
var print = false;
var mediaQueryList = window.matchMedia('print');
mediaQueryList.addListener(function (mql) {
    if (mql.matches) {
        closeResizeFn();
    } else {
        setTimeout(openResizeFn, 2000);
    }
});

// Firefox
window.onbeforeprint = function () {
    closeResizeFn();
};
window.onafterprint = function () {
    setTimeout(openResizeFn, 2000);
};

// Common Function
function openResizeFn() {
    $(window).on("resize", windowResize);
}

function closeResizeFn() {
    $(window).off("resize", windowResize);
}

function windowResize() {
    console.log("Window Resize");
}

You may also like...

22,045 Responses

  1. Joshuareoto表示:

    mexican rx online https://certpharm.com/# Mexican Cert Pharm

  2. AnthonyNum表示:

    Mexican Cert Pharm: mexican pharmacy – mexico drug stores pharmacies

  3. Joshuareoto表示:

    mexican pharmaceuticals online https://certpharm.shop/# mexican pharmacy

  4. AnthonyNum表示:

    Legit online Mexican pharmacy: Best Mexican pharmacy online – Cert Pharm

  5. Charlesrom表示:

    ‘I’m very impulsive’: Why this American woman moved to France at the age of 70
    русское порно жесток
    She’d dreamed of living in France for years, but according to Janice Deerwester, originally from Texas, life always seemed to get in the way.

    In 2021, Janice, who has been a widow since 2012, found herself lying on her bed with the lyrics to “Is That All There Is?,” a song about dissatisfaction that was a hit for country singer Peggy Lee back in 1969, playing in her head.

    “I hated that song when it came out, but all of a sudden it came to my mind,” Janice, who was based in Georgia at the time, tells CNN Travel. “I thought, ‘Is this all there is?’ I work, come home tired. I get up. Is this it?”
    Realizing that she wanted more from life, Janice decided there and then that she would relocate to Fontainebleau — the French town she’d had her heart set on since a 2018 visit. Less than a year later, at the age of 70, she did just that.

    “I’m very impulsive so that kind of followed the rule,” she adds.

    Now happily settled in Fontainebleau, located southeast of Paris, Janice feels that she “made the best choice ever” and is incredibly grateful to be living out her fantasy.

    “I am the luckiest woman I feel that ever was,” she says. ”And why I have this, and why I was given this, I have no idea. But I’m just blessed every day that I get to live here.”

    Janice goes on to explain that she wasn’t necessarily unhappy back in Georgia, and enjoyed living on a horse ranch in the country, which she had been renting since selling her home, but was overcome with the feeling that “there’s got to be more” to life.

  6. Rodneytah表示:

    http://certpharm.com/# Cert Pharm

  7. Fantastic piece of writing here1

  8. AnthonyNum表示:

    Cert Pharm: Best Mexican pharmacy online – Cert Pharm

  9. Jamesemulk表示:

    UTLH : Quand le staking et le financement réel se croisent dans un même écosystèmeLe marché des crypto-monnaies moderne regorge de dizaines de milliers de tokens, mais très peu peuvent se vanter d’une application réelle et d’une économie stable. UTLH est un exemple rare de projet combinant une rentabilité élevée grâce au staking et une fonctionnalité de garantie pratique qui rend le token demandé dans le cadre de l’Aide Financière Universelle (AFU). Ci-dessous, nous verrons comment UTLH crée un espace où chaque détenteur peut obtenir un revenu stable et un accès à des services financiers à des conditions avantageuses.UTLH et le programme AFU : soutien mutuel1.1. Financement sans bureaucratieDans les banques traditionnelles, le processus d’obtention d’un crédit peut prendre des semaines et être accompagné d’une montagne de documents. Les participants de l’AFU, en utilisant UTLH comme garantie, obtiennent des fonds beaucoup plus rapidement et plus simplement :Taux d’intérêt faiblesAbsence de longues vérifications de l’historique de créditSystème transparent géré par des contrats intelligents1.2. Demande garantieChaque personne décidant de rejoindre le club et d’obtenir un prêt avantageux doit acheter une certaine quantité de UTLH. Cela garantit une liquidité constante, car de plus en plus d’utilisateurs deviennent emprunteurs dans l’AFU et ont besoin de tokens pour la garantie.Staking à 24% par an : simplicité et rentabilité2.1. Des revenus qui couvrent les risquesDe nombreux tokens promettent des profits fantastiques dans des projets DeFi, mais ces mécanismes sont souvent complexes et instables. UTLH offre un taux fixe de 2% par mois, qui ne dépend pas des caprices du marché.Paiements mensuelsSeuil d’entrée minimum : il suffit de 1 UTLH pour commencer à staker2.2. Croissance stable et “gel”En plus des 2% mensuels, la majorité des tokens sont “gelés” dans le staking, ce qui signifie qu’ils ne sont pas disponibles sur le marché sous forme de ventes massives. Cela soutient davantage le cours du UTLH.Modèle économique : émission limitée et brûlagePas d’émissions supplémentaires. La plupart des tokens présentent un risque d’inflation, où l’équipe peut émettre de nouvelles pièces. Dans UTLH, l’offre est fixe, avec un peu moins d’un million de tokens.Un algorithme de brûlage réduit l’offre totale. Plus la demande est forte, plus le “brûlage” de la part de l’émission se produit rapidement, renforçant ainsi la valeur des tokens restants.Résultat : un actif rare, recherché pour participer à l’AFU et au staking, et donc pratiquement destiné à une croissance stable.Communauté d’entrepreneurs : moteur de développement4.1. Le club UTL : plus que des chats, un véritable réseau d’entraideContrairement aux “chats bruyants” dans les réseaux sociaux où les conversations sont souvent vides, UTL Club est centré autour de l’idée d’entraide mutuelle et de financement collaboratif.Briefings, cours de formationRecherche de partenaires pour des projets commerciauxSoutien réel et retour d’information4.2. Afflux de nouveaux participantsEn rejoignant le club, une personne ne se contente pas d’acquérir des UTLH pour la garantie ou le staking, mais elle s’implique également dans la communauté, développant ainsi une culture d’entraide. Cela contribue à rendre le token encore plus populaire et à accroître sa demande.Sécurité et décentralisationBinance Smart Chain : faibles frais et transactions rapides.Contrat intelligent ouvert : il est possible de vérifier la logique des calculs d’intérêts, les conditions de staking et autres mécanismes.Décentralisation : aucune structure centrale ne peut “geler” les actifs ou changer les règles. Tout est transparent et accessible via des explorateurs de blockchain.Comment commencer ?Ouvrez un portefeuille (MetaMask ou Trust Wallet avec support BSC).Achetez des UTLH via un échange, une plateforme ou votre espace membre du club.Participez au staking : effectuez un dépôt et commencez à recevoir 2% mensuels stables.Planifiez un financement : si nécessaire, mettez une partie de vos tokens en garantie pour obtenir un crédit avantageux dans l’AFU.ConclusionUTLH est un exemple de la manière dont une économie bien construite et une communauté solide permettent à un token non seulement de survivre, mais de prospérer.Les 24% annuels du staking attirent ceux qui cherchent un rendement élevé mais prévisible.La participation à l’AFU apporte une réelle valeur aux détenteurs : financement avantageux en échange d’un actif crypto, sans les barrières bureaucratiques classiques.L’émission limitée et le mécanisme de brûlage font du token un actif rare, ce qui stimule la hausse de son prix.Si vous recherchez une véritable opportunité de générer des revenus dans l’industrie crypto tout en utilisant vos actifs pour résoudre vos besoins financiers, UTLH mérite une attention particulière. Rejoignez le UTL Club et commencez à staker – c’est ainsi que vous pourrez ressentir comment les innovations dans le domaine du DeFi rendent votre vie plus simple et plus rentable. 

  10. Rodneytah表示:

    https://certpharm.com/# mexican pharmacy online

  11. Тут можно приобрести создание сайта клиника создание сайта для медицинского центра

  12. Pingidiof表示:

    darknet markets links dark web sites

  13. Joshuareoto表示:

    buying prescription drugs in mexico online http://certpharm.com/# Cert Pharm

  14. Joshuareoto表示:

    mexico pharmacies prescription drugs https://certpharm.com/# Cert Pharm

  15. CalvinRhymn表示:

    mexican pharmaceuticals online: Best Mexican pharmacy online – mexican pharmacy

  16. Rickyskalk表示:

    Unlock New Opportunities with MachFi.

    MachFi is at the forefront of decentralized finance on the Sonic Chain, providing an advanced borrow-lending platform. Our platform supports custom trading strategies, helping you unlock the full potential of your digital assets in a decentralized environment. visit to https://machfi.net/

    Key Features of MachFi:

    – Sonic Chain: Fast, secure, and reliable blockchain for DeFi transactions.
    – Customizable Lending: Choose strategies that work best for you.
    – Higher Returns: Capitalize on innovative DeFi solutions for superior returns.

    Join MachFi now and redefine your digital financial strategy!

  17. LarrykeW表示:

    Mexican Cert Pharm Legit online Mexican pharmacy Legit online Mexican pharmacy

  18. AnthonyNum表示:

    mexican pharmacy: Best Mexican pharmacy online – Legit online Mexican pharmacy

  19. AnthonyNum表示:

    mexican pharmacy: mexican pharmacy – mexican pharmacy online

  20. Rodneytah表示:

    https://certpharm.com/# Best Mexican pharmacy online

發佈留言

發佈留言必須填寫的電子郵件地址不會公開。