Mit diesem Snippet lässt sich die aktuelle Bildschirmauflösung abfragen, um mit ihr - in diesem Falle per jQuery - für die Smartphone-Ansicht eine Weiche einzubauen, die in Zusammenhang mit anderen Conditions auch wirklich nur bei kleinen Bildschirmen angezogen wird.
if (document.body.offsetWidth < 500) {
##AKTION##
}
Man legt ein Dummy-DIV #FOO ins HTML-Template
<div id="FOO"></div>
Dies wird nun im CSS, das unterhalb des @media screen fürs Smartphone liegt, auf "sichtbar" gesetzt
(parallel natürlich für die Desktop-Ansicht auf display: none;)
@media screen and (max-width : 500px) {
#FOO {
display: inline;
}
}
Die Sichtbarkeit fragt man dann im jQuery ab:
if ($("#FOO").is(':visible')) {
##AKTION##
}
Die ###AKTION### wird automatisch per jQuery ausgeführt, sobald die Smartphone-Ansicht bei Laden der Seite angezogen wird,
OHNE dass die Fensterbreite separat ausgelesen werden muss.