Jag vill använda olika stilmallar beroende på om användaren har större eller mindre än 1024 i skärmupplösning. Vad jag upfattade det som går det tyvärr inte att göra med asp, så det får göras med javascript. Men då har jag ett problem. Jag hade tänkt använda något script liknande detta:
Men problemet med det scriptet är att jag använder xhtml där inte document.write fungerar. Hur löser jag det på någon annat sätt eller har ni tipps på andra bättre scripts?
Ingen aning. Är inte så inne på javascript, men jag hade problem med script förut som använde document.write i xhtml. Men jag få helt enkelt testa och återkomma om det inte fungerar.
Det är bättre att använda som funktioner som createElement/createElementNS.
Ett annat alternativ är att länka in en php-sida som genererar stilmallen och tar upplösningen som en query-string.
Men det hade varit ännu bättre om du gjorde så att designen kunde anpassa sig efter storleken på sidan direkt, då många liksom jag inte surfar med läsaren maximerad.
Du kan ju kolla här
Adressen slutar sedan med 800.html, 1024.html eller 1280.html beroende av användarens upplösning.
Man hinner dock aldrig se scriptet då man ju slussas vidare direkt.
Du har det nedan, har använt det till min sida i ett par år nu.
<script language="JavaScript" type="text/javascript">
<!--
if (screen.width>1200) //Här länkar du till den sida som man ska komma till om skärmupplösningen är större än 1024 pixlar bred.
{window.location="1280.html";}
else if ((screen.width==1024) && (screen.height==768)) //Här länkar du till den sida som man ska komma till om skärmupplösningen är 1024x768.
{window.location="1024.html";}
else if ((screen.width==800) && (screen.height==600)) //Här länkar du till den sida som man ska komma till om skärmupplösningen är 800x600.
{window.location="800.html";}
else if (screen.width<800)
{
window.location="liten_upplosning.html"; //Här länkar du till den sida som man ska komma till om skärmupplösningen är mindre än 800 pixlar bred.
}
else
window.location="1280.html"; //Här länkar du till den sida som man ska komma till om skärmupplösningen är okänd.
//-->
</script>
Yes nu fungerar det! Tack peter! Det fungerade även i xhtml. Synd att de bara går att göra i javascript så inte alla kan ta del av funktionen. Men jag får lägga narrow css:en i en <noscript>.
Du kan ju kolla här
Adressen slutar sedan med 800.html, 1024.html eller 1280.html beroende av användarens upplösning.
Man hinner dock aldrig se scriptet då man ju slussas vidare direkt.
Du har det nedan, har använt det till min sida i ett par år nu.
<script language="JavaScript" type="text/javascript">
<!--
if (screen.width>1200) //Här länkar du till den sida som man ska komma till om skärmupplösningen är större än 1024 pixlar bred.
{window.location="1280.html";}
else if ((screen.width==1024) && (screen.height==768)) //Här länkar du till den sida som man ska komma till om skärmupplösningen är 1024x768.
{window.location="1024.html";}
else if ((screen.width==800) && (screen.height==600)) //Här länkar du till den sida som man ska komma till om skärmupplösningen är 800x600.
{window.location="800.html";}
else if (screen.width<800)
{
window.location="liten_upplosning.html"; //Här länkar du till den sida som man ska komma till om skärmupplösningen är mindre än 800 pixlar bred.
}
else
window.location="1280.html"; //Här länkar du till den sida som man ska komma till om skärmupplösningen är okänd.
//-->
</script>
Du borde istället använda dig av min metod då det är grymt mycket bättre att bara byta stilmallarna. Jag skulle aldrig använda sidor med likadant innehåll då det inte gillas av google.
Du skulle använda dig av en annan metod nille, det är grymt mycket bättre att låta sidan anpassa sin storlek mha css och inte js.
Vad är fördelen med det förutom att folket med javascript inaktiverat förlorar den funktionen. Att göra den i % kommer bli grymt jobbigt med massor av problem, och jag vill inte använda tabeller. Men när display:table fungerar fullt ut så skippar jag javascriptet!
Jag komm på att min lösning inte fungerar eftersom <noscript> inte är tillåtet innom head. Om jag bara länkar in css filen på vanligt sätt, vilken css mall prioriteras då? Den i javascriptet eller den vanligt länkade? Om jag inte kommer ihåg fel ska vanligt länkade stilmallar prioriteras framför dem sim är länkade med @import. Så det kanske är ett sätt att länka stilmallen för de som inte har javascript med @import? Men vågar jag lita på att alla läsare gör samma prioritering?