blog.exotec

TYPO3 . XHTML/CSS . JavaScript/AJAX . iPhone/iOS

CSS Datei abhängig von Auflösung laden

Nachdem ich heute vergeblich nach einem einfachen Javascript gesucht habe, welches die Auflösung des Benutzers ermittelt und in dieser Abhängigkeit eine entsprechende CSS läd, hab ich dann doch recht schnell diese Funktion selber schreiben können. Ist garantiert nicht perfekt, aber sie funktioniert.

Das Projekt welches diese Funktion benötigte besteht auch einem klassischen zweispaltigem Layout, welches für einer 1024er Auflösung “optimiert” wurde. Nun sollte aber ab einer 1280er zusätzlich noch eine Spalte rechts erscheinen in der sich Werbung befindet.

Über Sinn oder Unsinn solcher Lösungen will ich gar nicht reden, es geht mir nur um die simple Javascriptfunktion an sich.

setcss.js:
function setcss() {
if (screen.width == 1024) {
document.write("<link rel=stylesheet type=text/css href=main.css />");
}
if (screen.width > 1024) {
document.write("<link rel=stylesheet type=text/css href=main2.css />");
}
if (screen.width < 1024) {
document.write("<link rel=stylesheet type=text/css href=main.css />");
}
}

im Head dann:
<script language="JavaScript" type="text/javascript" src="Pfad_zu/setcss.js"></script>
<script type="text/javascript">
<!--
setcss();
//-->
</script>

7 Kommentare zu 'CSS Datei abhängig von Auflösung laden'

Auf dem Laufenden bleiben per RSS oder TrackBack zu 'CSS Datei abhängig von Auflösung laden'.

  1. Dine sagt,

    Februar 3rd, 2006 um 1:43 pm

    Hallo,

    vielen Dank für dieses Script. Funktioniert einwandfrei.
    Vielen Dank !!!! *g*

  2. monika sagt,

    September 30th, 2006 um 10:43 pm

    dass ich das noch erleben darf, nach einer stunde suche doch so ein script gefunden zu haben …. echt vielen herzlichen dank!!!

  3. hansn sagt,

    Juni 14th, 2007 um 12:15 pm

    hallo,

    vielen Dank für die Hilfe, klappt super. Ich kenn mich mit JS noch nicht so gut aus, aber könnte man nicht Abfrage 1 und 3 kombinieren ? also if (screen.width

  4. hpy sagt,

    September 26th, 2007 um 12:49 am

    at hansn:
    ja das sollte problemlos möglich sein, probiers einfach aus. ich denke sogar js sollte “kleinergleich” kennen..

    danke übrigens für das kleine snipplet, wird morgen eingebaut :)


  5. Januar 7th, 2008 um 2:17 am

    […] <script type="text/javascript"> <!– setcss(); //–> </script> Quelle: CSS Datei abhängig von Auflösung laden Das Ganze lässt sich auch direkt in nur einem Aufruf schreiben, habe ich aber nicht getestet und […]

  6. Eric Merten sagt,

    Juli 14th, 2008 um 10:52 pm

    internet sei dank für diese elegante lösung. auch wenn es schon ein bissl länger her ist, wie ich sehe. hat aber trotzdem mein problem in 5 min gelöst. vielen dank.

  7. duk-nt sagt,

    September 22nd, 2010 um 3:21 pm

    gott sei dank, ich such schon eine halbe ewigkeit nach einem einfachen und verständlichem script und bin endlich fündig geworden! danke!

Kommentar schreiben:


94,530 Spam-Kommentare
blockiert von
Akismet