web-dev-qa-db-fra.com

Empêcher l'écran blanc avant de charger la page en chrome?

Quand une page ne se charge pas immédiatement, Chromium et tous les autres navigateurs que j'ai essayés affichent un écran blanc avant de recevoir une réponse:

enter image description here

Même si chrome://settings/personal dit qu'il utilise le thème GTK + - dans mon cas, c'est Darklooks, qui a un arrière-plan sombre:

enter image description here

Existe-t-il un moyen d'éviter cela en chrome? Ou, s'il n'y en a pas, y a-t-il un navigateur qui n'a pas ce "problème"?

37
Alex

Belle solution de contournement vasa1, les flashs blancs ont disparu. Mais l'arrière-plan de certains sites Web devient noir, ce qui est un peu moche:

enter image description here

J'ai donc adapté ce CSS et fini par:

html:not(:hover), body:not(:hover){
    background-color:#000000;
}

Cela signifie que lorsque le curseur ne se trouve pas sur la page, l’arrière-plan est défini sur le noir. Lorsque vous cliquez sur le nouvel onglet, le curseur ne se trouve pas sur la page. Un arrière-plan noir clignotera au lieu d’un blanc. Lorsque vous passez le curseur de la souris sur la page (lorsque vous le lisez), le fond noir est alors oublié et celui du site Web est utilisé:

enter image description hereenter image description here

2
Alex

Pour Google Chrome et Chromium, vous êtes probablement victime de Problème 1373: la navigation dans des sites Web à arrière-plan sombre génère des flashs blancs aveuglants entre les pages .

Il y a un hack à minimiser, mais pas totalement à éliminer, votre misère décrite dans le commentaire 261 :

En guise de solution temporaire, je règle la feuille de style de l'utilisateur personnalisé de manière à rendre les pages avec un arrière-plan noir. Ainsi, avant de recevoir des informations de style du site Web, la fenêtre est rendue noire au lieu de blanc. les yeux jusqu'à ce qu'une solution permanente soit faite.

Le hack implique l’ajout des lignes suivantes à votre Custom.css qui se trouve dans User Stylesheets dans votre dossier Default. Dans mon cas, le chemin est ~/.config/chromium/Default/User Stylesheets.

html, body{
background-color:#000000; //This sets the background color to black
color:#0000FF; //This sets the text to blue, so you can read it on webpages set to use defaults; white is too hard on my eyes and if you dont put this it will be black on black
}

Pour ce qui est de Firefox, j’utilise le code suivant dans userChrome.css situé dans ~/.mozilla/firefox/profile_name/chrome:

@namespace xul url(http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul);

/*prevent white flash*/
tabbrowser tabpanels { background-color: #111 !important}

Si le dossier chrome n'existe pas, créez-le. Notez que chrome et userChrome.css sont sensibles à la casse.

14
user151227

Autant que je sache, toutes les anciennes méthodes qui corrigeaient ce bogue ne fonctionnaient plus (en 2016). J'ai trouvé une solution aujourd'hui pour surmonter ce problème et en ai écrit quelques unes qui sont disponibles ici: http://jollo.org/LNT/public/chrome-white-flash.html .

Il utilise essentiellement un script autohotkey qui peint la fenêtre sur elle-même jusqu'à ce que la page suivante soit chargée, en contournant la période au cours de laquelle la fenêtre clignote.

3
fanfare

UPDATE: J'ai modifié ma réponse pour utiliser une gradation temporaire de l'écran car ma solution précédente était erronée et que l'état de défilement du navigateur était brisé.

Cette solution utilise un script d'automate configuré en tant que service mis à la disposition de Chrome et enfin mappé sur un raccourci clavier du système. La solution simple consistait simplement à assombrir l’écran environ 5 fois, mais j’aimerais jouer avec cet envoi en fonction de votre luminosité. Si vous utilisez un paramètre très sombre par exemple, l’écran peut être complètement noir pendant une seconde, mais cela reste meilleur que le flamboiement du blanc.

Voir https://Gist.github.com/lacostenycoder/01108de10fe02e2f39d9cceb2457b895

on run {input, parameters}

    set the_application to (path to frontmost application as Unicode text)

  repeat 5 times
    tell application "System Events"
          key code 107
      end tell
  end repeat
  delay 1

    tell application "System Events"

    keystroke "t" using command down
    delay 1

    end tell
  delay 1 
  repeat 5 times
    tell application "System Events"
          key code 113
      end tell
  end repeat

    return input
end run
1
lacostenycoder

Nice one, ça marche sur l'histoire. La meilleure chose à faire est de prendre le code original et de changer le texte en une couleur claire. Le second code n'a pas fonctionné, en voici un:

Cette page explique comment changer la couleur du flash avec un JS.

Chrome clignote à l’écran noir lors de l’utilisation de la transition css

0
com.prehensible