css-datei je nach Bildschirmgröße wechslen

irmen

Hallo, kann mir bitte jemand beim codeschreiben helfen?
Ich habe gelesen, dass man mit javascript die Bildschirmgröße ermitteln kann.

Ich würde das gerne abfragen und beim css-aufruf dann entsprechend die styledatei festlegen.

Theoretisch so:

Zitat

[COLOR=#ff00ff]<?php if screen.width>=1280 und gleichzeitig screenheight>=1024?>[/COLOR]<link href="[COLOR=royalblue]Pfad zur anderen css-datei[/COLOR][COLOR=black]" [/COLOR]
[COLOR=magenta]else[/COLOR]
<link href="<?php bloginfo('stylesheet_url'); ?>"[COLOR=#ff00ff]<?php endif; >[/COLOR][COLOR=#000000]type="text/css" rel="stylesheet" media="screen" />[/COLOR]

1. geht das grundsätzlich?
2. Kann mir jemand helfen, weil ich beim coden so ahnungslos bin ... wo welche klammern kommen, etc.??
3. Es werden in den Seiten (per benutzerdefinierte Felder) Bilder festgelegt. Kann ich im Template auch einfach die If abfrage dazupopeln, damit im Falle der größeren Auflösung auch jeweils eine größere variante der Bilder geladen werden?(die ich natürlich vorher uploade und mit name[COLOR=yellowgreen]gross[/COLOR].jpg benenne)
so :

Zitat

<div id="dasbild">
<img src="<?php bloginfo('url'); ?>/wp-content/uploads/<?php $inhalt = get_post_meta($post->ID, 'grossesbild', true); ?>
<?php echo $inhalt; ?>[COLOR=magenta]<?php if screen.width>=1280 und gleichzeitig screenheight>=1024?>[/COLOR][COLOR=magenta]+"gross"+[/COLOR][COLOR=magenta]<?php endif; ?>[/COLOR].jpg" NAME="dasbild" /></div>

Vielen Dank für ein paar tipps!!
Irmen

Werbepost

Hallo!

Wenn du gerade an deiner Website arbeitest oder dein aktuelles Hosting überdenkst: Wir betreiben mit NetzLiving eine Hosting-Plattform, die speziell auf Performance, Sicherheit und einfache Verwaltung ausgelegt ist.

✔️ Schnelle Ladezeiten (optimiert für WordPress & Co.)
✔️ Deutsche Server & DSGVO-konform
✔️ Persönlicher Support (kein 0815-Ticket-System)

Mehr erfahren

irmen

Weiß das keiner,oder darf man sowas nicht fragen?
Gibt es vielleicht irgendein plugin das die css wechseln kann je nach bildschirmgröße/auflösung?

Danke für einen Tipp!

nepf

guck mal hier - gleich das erste beispiel wird dir weiter helfen:

http://de.selfhtml.org/javascript/obj…htm#allgemeines

Tutrix

kannst ja mal dies

Code

<noscript><link  href="standard-style.css"  rel="stylesheet" type="text/css"/></noscript>




<script type="text/javascript">
 if (screen.width == 1024) {
document.write('<link rel="stylesheet" type="text/css" href="1024.css">');
alert("style.css für 1024 x 768 wird geladen.");
}
else if (screen.width == 1280) {
document.write('<link rel="stylesheet" type="text/css" href="1280.css">');
alert("style.css für 1280 x 960 wird geladen.");
}
</script>

Alles anzeigen

versuchen

als standard-style.css solltest du die definieren, die geladen wird wenn der Besucher Javascript deaktiviert hat

irmen

vielen Dank!
ich hab inzwischen auch wasausprobiert. aber irgendwie kann ich vielleicht php und js nicht in dieserArt mischen - kannst du mir sagen was da falsch ist?

Zitat

[COLOR=#000000]<script language=javascript>
breite=screen.width;
hoehe=screen.height;
if ((breite>=1280)&&(hoehe>=1024))
{
<link href="<?php bloginfo('stylesheet_url'); ?>" type="text/css" rel="stylesheet" media="screen" />
}
else
{
<link href="<?php bloginfo('template_url'); ?>/style2.css" type="text/css" rel="stylesheet" media="screen" />
}
</script>[/COLOR]

Alles anzeigen

irmen

Vielen Dank, habe deinen code genommen und mitmeinem Kombiniert.
Jetzt klappts.
schönen Gruß!

Willkommen! Melden Sie sich an oder registrieren Sie sich.

css-datei je nach Bildschirmgröße wechslen

Jetzt mitmachen!