Hab dir mal was zusammengeschrieben (auch mit jquery für das Merken des aktuellen Scriptes)
übrigens lag das Problem an:
media=„screen and (max-device-width:899px)“
deswegen hat der nicht aktualisiert.
media=„screen“ sollte es sein.
Den Viewport bzw. breite kannst du anders festlegen:
www.mediaevent.de/css/viewport-mobile.html
@viewport {
width: 320px;
zoom:1;
}
meine Datei heißt:
test.php
nach dem Switchen des Styles wird der Status per unsichtbaren Request dem Server mitgeteilt und als Session gespeichert.
beim nächsten harten Aufruf wird die aktuelle CSS Datei als letztes geladen.
Wenn das nicht funktioniert, wird dennoch bei document.ready noch einmal ein style-Switch durchgeführt aber diesmal mit Modus 0, damit nicht noch ein Request an per AJAX an den Server geht.
<?php session_start();
if (isset($\_GET['action']))
{
$action=(int)$\_GET["action"];
$stylesheet=$\_GET["stylesheet"];
if ($action==1)
{
///aktuellen Stylesheet speichern
$\_SESSION["aktuellesstylesheet"]=$stylesheet;
exit();
}
}
?\><?php if ($_SESSION["aktuellesstylesheet"]=="") //noch nichts gesetzt
{
$\_SESSION["aktuellesstylesheet"]="style"; //was wird als erstes geladen?
}
$stylesheets=array();
$stylesheets[]="style";
$stylesheets[]="handheld";
$ausgabe='';
$ausgabealsletztes='';
foreach ($stylesheets as $item)
{
if ($\_SESSION["aktuellesstylesheet"]==$item) //Wenn es dem aktuellem Stylesheet entspricht, wird es als letztes geladen
{
$ausgabealsletztes='
';
}
else
{
$ausgabe='
';
}
}
echo $ausgabe;
echo $ausgabealsletztes;
?\>
$( document ).ready(function() {
\<?php
if ($\_SESSION["aktuellesstylesheet"]!="") //noch nichts gesetzt
{
echo "changeStyle('".$\_SESSION["aktuellesstylesheet"]."',0);"; //was wird als erstes geladen?
}
?\>
});
function ajaxurltoserver(url,title)
{
var jqxhrsx = $.ajax({
type: 'GET',
url: url,
scriptCharset: "utf-8" ,
contentType: "application/x-www-form-urlencoded; charset=UTF-8",
cache: false
}).done(function( html ) {
//Wenn fertig, dann kann auch Infoausgabe aktualisiert werden
if (document.getElementById('divaktuellesstylesheet'))
{
document.getElementById('divaktuellesstylesheet').innerHTML=title;
}
});
}
function changeStyle(title,mode) {
var lnks = document.getElementsByTagName('link');
for (var i = lnks.length - 1; i \>= 0; i--) {
if (lnks[i].getAttribute('rel').indexOf('style')\> -1 && lnks[i].getAttribute('title')) {
if (lnks[i].getAttribute('title') == title)
{void(lnks[i].disabled = false);
if (mode==1) //im Modus 0 (document.ready) wird nicht nochmal ein extra Request abgesetzt
{
ajaxurltoserver('test.php?action=1&stylesheet='+title,title);
}
}
else
{void(lnks[i].disabled = true);
//alert(lnks[i].getAttribute('title') + ' deaktiviert');}
}}}
}
Klassisch | Handheld
**TEST1**
<?php echo "aktuell geladenes Stylesheet ist
".$\_SESSION["aktuellesstylesheet"]."";
?\>