Problem mit einer simplen if-Anweisung

sindyho0374 · 01.03.2016

Hallo Freunde.
ich habe ein Problem mit einer if-Anweisung.
Bitte macht euch nicht lustig aber da ich noch nicht richtig fit in PHP bin würde ich da mal eure Hilfe benötigen.
Ich habe mir 2 Div Container in einer CSS angelegt (#rot u. #gruen)
Diese will ich mir nur zu Testzwecken in einer if-Anweisung ausgeben lassen.
Also zum Verständnis:
Der Div #rot soll bei einer Auflösung von mindestens 1200px ausgegeben werden.
Der Div #gruen soll dann ausgegeben werden wenn die Auflösung kleiner als 1200px ist.

Die if-Anweisung sieht dann so aus:

PHP:

        <?php
        if('min-width: 1200px'){
            echo '<div id="rot"></div>';
        }
        else {
            echo '<div id="gruen"></div>';
        }
        ?>

Es wird aber nur #div rot ausgegeben auch wenn ich die Bildschirmbreite verringere.
Was mache ich falsch?
Ich hoffe ihr könnt mir hier weiterhelfen
Danke im voraus.

Duddle · 01.03.2016

Du wirfst hier mehrere Sprachen und Verantwortlichkeiten durcheinander. Abgesehen von der falschen Syntax solltest du dir erstmal klar machen, warum das nicht funktionieren kann.

PHP ist eine serverseitige Sprache. Das heisst, du als Endnutzer bekommst immer nur ein Ergebnis zu sehen. Dieses wird zwar dynamisch beim Server erzeugt (und kann entsprechend auf bestimmte Dinge reagieren), aber dein Browser bekommt immer nur die Endausgabe zu sehen.
Deshalb wird (abgesehen von irgendwelchen Hacks, die wir hier mal ignorieren) PHP niemals auf eine clientseitige Änderung wie dem Verändern der Browsergröße reagieren.

Eine clientseitige Sprache wie JavaScript hingegen läuft bei dir lokal, kann also bei lokalen Ereignissen handeln. JS wurde und wird daher noch recht häufig für das "responsive Webdesign" eingesetzt. Das ist ja offensichtlich dein Ziel.

Noch besser dafür sind dynamische CSS-Eigenschaften. CSS dient (größtenteils) zum Definieren des Aussehens deiner HTML-Elemente. Früher war das auf statische Regeln beschränkt (ergo Dynamik durch JS), aber dann wurden Media Queries in den Standard eingeführt, die Fallunterscheidungen und damit die Anpassung aufgrund von Browser-Parametern live erlauben.

Kurz: schau dir entweder Media Queries oder JavaScript an, wenn responsive Webdesign dein Ziel ist. PHP ist dafür der falsche Ansatz.

Abgesehen davon wirft deine Fallunterscheidung immer den Wahr-Fall (rot) aus, weil nicht-leere Strings in PHP als "true" evaluiert werden.

Duddle

sindyho0374 · 01.03.2016

Okay leuchtet ein.
Mit mediaquerys habe ich mich schon oft beschäftigt und das is ja auch nicht schwer zu kapieren.
Ich habe vielleicht bei meiner Fragestellung den Fehler gemacht das ich mit Divs versucht habe das Problem zu erklären.
Eigentlich ist ja vorgesehen eine Navigation bei einer Auflösung von mindestens 1200 Pixel anzeigen zu lassen die sich von einer Responsiven Navigation deutlich unterscheidet vom Aufbau und Verhalten.
Deshalb dachte ich mir das ich es auf diese Art und Weise lösen kann.

msa1989 · 01.03.2016

Korrigiert mich, aber soweit ich weiß kann man mit PHP nicht die Fenstergröße des Browsers feststellen.

Du hast jetzt zwei Möglichkeiten:

Du machst beide Menüs komplett fertig und blendest über Media Queries das entsprechende Menü ein. Der Quellcode ist folglich immer komplett auf der Seite. (ich denke ich würde es so machen)
Du erkennst mit PHP ob es sich um ein mobiles Gerät handelt (da gibts bei Github diverse Skripte die zuverlässig erkennen ob es ein Mobiltelefon, Tablet etc. ist) und bindest dann je nach Bedarf das passende Menü ein. Hier gehst du halt dann davon aus, dass wenn es als Handy erkannt wird, das nur eine gewisse Breite zur Verfügung steht.

owieortho · 01.03.2016

Ich habe mal einen gut 10 Jahre alten Schnipsel ausgegraben, wo man das Zusammenspiel von client- und serverseitigem Skript gut sehen kann:

PHP:

<?php
if ($res) {
echo "<body background=\"../images/bg3" . $res . ".jpg\">";}
else {
echo "<body>
<script language=\"Javascript\">
<!--

if (screen.width <= 640) {
document.location = \"index.php?res=vga\";
}

else if (screen.width <= 800) {
document.location = \"index.php?res=svga\";
}

else if (screen.width <= 1024) {
document.location = \"index.php?res=xga\";
}

if (screen.width > 1024) {
document.location = \"index.php?res=xga\";
}

//-->
</script>"
;
}
?>

Das JS ermittelt die Bildschirmbreite und verweist dann per entsprechender GET-Anweisung die index.php auf das zu wählende Hintergrundbild. Mit mediaqueries ist das natürlich weitaus bequemer, es geht aber nur um die grundsätzliche Idee...

O.