[bug] Grijs scherm bij 1e bezoek site [Android]

[mambo No5]

Locatie
Elke pagina bij het 1e bezoek.

Omschrijving
De browser geeft bij elk eerste bezoek van een nieuwe browsersessie een grijs scherm weer wat wel te verplaatsen is, maar verder geen informatie weergeeft. Een aantal keer refreshen of de optie Desktopversie opvragen aanvinken binnen de browser zelf verhelpt dit wel uiteindelijk. De browser laat wel heel kort even de normale desktopversie zien terwijl deze nog aan het laden is, maar springt dan vervolgens op grijs.

Stappen om het te reproduceren
-Volledig nieuwe sessie opstarten binnen de browser (browser helemaal afsluiten en opnieuw opstarten)
-Navigeren naar gathering.tweakers.net (ongeacht welke subpagina) bijvoorbeeld

Platform
Android 4.2.2
Browser
Default Android browser (hoe heet dat ding, AOSP?)
Type apparaat
LG G2

nb, bij Chrome heb ik hier helemaal geen last van, de bug lijkt qua omschrijving wel een beetje op Grijs scherm op WP8. Als de pagina eenmaal een keer correct geladen is werkt alles prima, maar net dat 1e stukje hapert een beetje.

[Misha]

Ik kan dit niet reproduceren. heb je hier nog steeds last van?

[mambo No5]

Mwa, last wil ik het niet noemen, maar 't gebeurt nog steeds ja. Even op Youtube gedumpt om een visueel idee te geven van hoe en wat:

[YouTube: http://youtu.be/WOMSRyoo2lQ]

[Verwijderd]

Ik heb op een Nexus 7 hetzelfde probleem op de frontpage, ik zie de tracker, en meer niet. Als ik de tracker (mbv de laptop) links uit beeld laat glijden zie ik alleen maar grijs.
Het enige dat werkt is de tablet landscape gebruiken en dat is niet bepaald mijn voorkeur.

Dit probleem had ik vrijdag nog niet, en voorzover ik weet heb ik geen instellingen veranderd.

[Bosmonster]

Ik heb op mijn iPhone 5s ook dit probleem ineens sinds gisteren. En dat was gewoon een refresh (heb T.NET altijd open op een tab). Kan de site niet meer bezoeken.



edit: geldt ook voor gathering.tweakers.net.

[ Voor 49% gewijzigd door Bosmonster op 12-01-2014 11:00 ]

[Misha]

Zouden jullie voor me kunnen kijken of dit komt door eventuele custom css? Even de stylesheet eventjes uitzetten en dan kijken of het probleem zich nog steeds voordoet?

Dat helpt met de debug

[Verwijderd]

In mijn geval hielp dat. Ik had er dit instaan:

#categoryBar,
#jobs,
#categoryDropdown,
#newsletter,
#bottom,
#pricewatch,
#socialButtons,
#bestBuyGuideBlock,
#true{
display:none;
}

[crisp]

Ik gok dat het de display:none op #bottom is en ik weet ook waarom: daarin staat het element #devicegrade waarmee we de huidige grade in JS bepalen. Als die niet gerendered wordt gaat dat fout...

[mambo No5]

Ik heb geen enkele custom CSS draaien overigens.

[crisp]

Dan kan het nog een JS error zijn, of de methode om in JS de grade te bepalen gaat toch niet altijd helemaal goed. Uiteraard werkt het ook niet goed als JS helemaal uit staat, maar ik gok dat dat minder vaak het geval zal zijn.

[Verwijderd]

crisp schreef op zondag 12 januari 2014 @ 14:25:
Ik gok dat het de display:none op #bottom is en ik weet ook waarom: daarin staat het element #devicegrade waarmee we de huidige grade in JS bepalen. Als die niet gerendered wordt gaat dat fout...

Met bottom uit de cCSS werkt hij inderdaad. Thanks!

[Bosmonster]

Dat hielp hier ook!

Een kijken of ik de onderdelen los uit kan zetten in #bottom

In plaats van #bottom kun je ook gewoon #ticker en #about uitzetten.

Mijn volledige css nu die geen problemen meer geeft:

Cascading Stylesheet:

#fp_tabs_container,
#pricewatch.fpItem,
#newsletter.fpItem,
#jobs.fpItem,
#community.fpItem,
/*#bottom,*/
#ticker,
#about,
#relatedTags,
#forumdays,
div.forum_actions ul.action_list,
#title p.mods,
#tweakbase_relations,
#categoryBar { display: none; }

#layout {
    padding-bottom: 20px;
}

#relatedTags + .forum_actions {
    margin-top: -38px;
}

#title {
    margin-right: 100px;
}

#logo + .sitename {
   text-indent: -9999px;
}

[ Voor 78% gewijzigd door Bosmonster op 13-01-2014 09:48 ]

[crisp]

Ik heb lokaal de devicegrade detectie in JS al anders gedaan. Moderne browsers die matchMedia ondersteunen hebben daarbij helemaal geen #devicedetect div meer nodig. Voor oudere browsers wordt dit element nu niet meer in #bottom gezet maar direct als child van body.