/ Forside / Teknologi / Udvikling / Java Scripts / Nyhedsindlæg
Login
Glemt dit kodeord?
Brugernavn

Kodeord


Reklame
Top 10 brugere
Java Scripts
#NavnPoint
molokyle 5410
Klaudi 2799
smorch 2439
kim 1360
Harlekin 1134
bentjuul 984
gibson 800
severino 695
Random 675
10  konsulent.. 626
Ændre stylesheet efter den besøgendes skær~
Fra : Adam


Dato : 13-10-09 06:06

Hejsa

Jeg har et 'lille' problem:

Jeg vil meget gerne have valideret på klientsiden hvilken
skærmopløsning brugeren har: 800x600, 1024x768 eller 1280x1024, og vil
så gerne ha' at stylesheet'et bliver udskiftet alt efter resultatet af
opløsningentjekket.

Valideringen virker fint nok, men udskiftningen af stylesheet virker
ikke...

Koden jeg bruger:

Mit stylesheet-link i min index.fil: <link rel="stylesheet" type="text/
css" href="style/default.css">

Javascript:

if ((screen.width==1280) && (screen.height==1024))
{
document.getElementById("stylesheet").href = "style/
default1024x768.css";
}
else if ((screen.width==1024) && (screen.height==768))
{
document.getElementById("stylesheet").href = "style/
default1024x768.css";
}
else
((screen.width==800) && (screen.height==600))
{
document.getElementById("stylesheet").href = "style/
default800x600.css";
}

Men ingenting forandrer sig, når jeg prøver scriptet af...

Hvad mangler jeg?

Hilsen
Adam

 
 
Erik Ginnerskov (13-10-2009)
Kommentar
Fra : Erik Ginnerskov


Dato : 13-10-09 13:35

Adam wrote:
> Hejsa
>
> Jeg har et 'lille' problem:
>
> Jeg vil meget gerne have valideret på klientsiden hvilken
> skærmopløsning brugeren har: 800x600, 1024x768 eller 1280x1024,

Hvad vil du det for? Det er da meget enklere at lave siden med flydende
design - siden tilpasser sig automatisk den til rådighed værende bredde på
browservinduet.

Skærmens opløsning har alligevel ikke nogen sammenhæng med hvor stort
brugerens browservindue er, snarere tvært imod: Jo større skærmopløsning des
større sandsynlighed for at browservinduet er væsentligt mindre end full
screen.

--
Med venlig hilsen
Erik Ginnerskov
http://hjemmesideskolen.dk - http://ginnerskov.dk
http://html-faq.dk


Jørgen Farum Jensen (13-10-2009)
Kommentar
Fra : Jørgen Farum Jensen


Dato : 13-10-09 13:50

Adam skrev:
> Hejsa
>
> Jeg har et 'lille' problem:
>
> Jeg vil meget gerne have valideret på klientsiden hvilken
> skærmopløsning brugeren har: 800x600, 1024x768 eller 1280x1024, og vil
> så gerne ha' at stylesheet'et bliver udskiftet alt efter resultatet af
> opløsningentjekket.
>
> Valideringen virker fint nok, men udskiftningen af stylesheet virker
> ikke...
>
> Koden jeg bruger:
>
> Mit stylesheet-link i min index.fil: <link rel="stylesheet" type="text/
> css" href="style/default.css">
>
> Javascript:
>
> if ((screen.width==1280) && (screen.height==1024))
> {
> document.getElementById("stylesheet").href = "style/
> default1024x768.css";
> }
> else if ((screen.width==1024) && (screen.height==768))
> {
> document.getElementById("stylesheet").href = "style/
> default1024x768.css";
> }
> else
> ((screen.width==800) && (screen.height==600))
> {
> document.getElementById("stylesheet").href = "style/
> default800x600.css";
> }
>

Det er måske fordi du ikke har noget element på
websiden med id="stylesheet"?

I øvrigt tilslutter jeg mig helt Eriks kommentar.
Der er nyttigere ting du kan fortage dig med en
styleswitcher, se for eksempel
http://webdesign101.dk/design/styleswitch.php

--

Med venlig hilsen
Jørgen Farum Jensen
Håndbog i webdesign: http://webdesign101.dk/wwwbog/udgave2/
Webdesign med stylesheets: http://webdesign101.dk/cssbog/
..

Philip Nunnegaard (13-10-2009)
Kommentar
Fra : Philip Nunnegaard


Dato : 13-10-09 14:28

Jørgen Farum Jensen skrev:

>> if ((screen.width==1280) && (screen.height==1024))

> I øvrigt tilslutter jeg mig helt Eriks kommentar.

Og skulle man endelig gøre det andet, ville document.body.clientWidth
(mener jeg at det hedder) give mere mening, altså et tjek på
*browservinduets* bredde, og ikke *skærmens* ditto.

Foretrækker dog også selv variabel bredde, gerne defineret i %, evt. med
en max-width for at undgå for lange linjer.

--
Philip - der ikke kører med maksimeret vindue

Kim Ludvigsen (13-10-2009)
Kommentar
Fra : Kim Ludvigsen


Dato : 13-10-09 20:02

Philip Nunnegaard skrev:
> Jørgen Farum Jensen skrev:
>
>>> if ((screen.width==1280) && (screen.height==1024))
>
>> I øvrigt tilslutter jeg mig helt Eriks kommentar.
>
> Og skulle man endelig gøre det andet, ville document.body.clientWidth
> (mener jeg at det hedder) give mere mening, altså et tjek på
> *browservinduets* bredde, og ikke *skærmens* ditto.

Ja, og kun bredden. Ikke højden.

--
Mvh. Kim Ludvigsen
Validerende multimedia på hjemmesiden:
http://kimludvigsen.dk/tips-internet-websnedker-multimedia.php

Adam (14-10-2009)
Kommentar
Fra : Adam


Dato : 14-10-09 05:34

On 13 Okt., 21:01, Kim Ludvigsen <use...@kimludvigsen.dk> wrote:
> Philip Nunnegaard skrev:
>
> > Jørgen Farum Jensen skrev:
>
> >>> if ((screen.width==1280) && (screen.height==1024))
>
> >> I øvrigt tilslutter jeg mig helt Eriks kommentar.
>
> > Og skulle man endelig gøre det andet, ville document.body.clientWidth
> > (mener jeg at det hedder) give mere mening, altså et tjek på
> > *browservinduets* bredde, og ikke *skærmens* ditto.
>
> Ja, og kun bredden. Ikke højden.
>
> --
> Mvh. Kim Ludvigsen
> Validerende multimedia på hjemmesiden:http://kimludvigsen.dk/tips-internet-websnedker-multimedia.php

Hejsa alle,

Tak for jeres svar.

I har nok ret i at jeg burde tjekke browservinduets bredde i stedet
for skærmens...

Det layout jeg er ude i sat op en %-vis definering af de DIV-lagene
jeg bruger - problemet er 'bare' at der nogle grafiske elementer med
en vis størrelse der helst skulle skaleres alt efter hvilken størrelse
browservindue har... Det er vel 'nemmest' at gøre i stylesheet'et,
eller hur?

Med venlig hilsen
Adam

Erik Ginnerskov (14-10-2009)
Kommentar
Fra : Erik Ginnerskov


Dato : 14-10-09 13:55

Adam wrote:

> problemet er 'bare' at der nogle grafiske elementer med
> en vis størrelse der helst skulle skaleres alt efter hvilken størrelse
> browservindue har... Det er vel 'nemmest' at gøre i stylesheet'et,
> eller hur?

Man kan skalere grafik/billeder i browseren, men resultatet er ikke værd at
snakke om. Et grafikprogram er bedre til den slags.

--
Med venlig hilsen
Erik Ginnerskov
http://hjemmesideskolen.dk - http://ginnerskov.dk
http://html-faq.dk


Philip Nunnegaard (14-10-2009)
Kommentar
Fra : Philip Nunnegaard


Dato : 14-10-09 16:51

Erik Ginnerskov skrev:

> Man kan skalere grafik/billeder i browseren, men resultatet er ikke værd
> at snakke om. Et grafikprogram er bedre til den slags.

Alternativt acceptere at visse <div>'er har en fast bredde og så lade
resten tilpasse bredde til resten af den bredde der er til rådighed.

Men nu kender jeg ikke disse grafiske elementers størrelse. Hvis de er
meget brede (300-400 px) er det nok noget andet. Så tager de jo en
væsentlig del af bredden i et 800x600-vindue.


--
Philip - http://chartbase.dk | http://www.hitsurf.dk

Lasse Reichstein Nie~ (14-10-2009)
Kommentar
Fra : Lasse Reichstein Nie~


Dato : 14-10-09 16:47

Adam <aj.linux@gmail.com> writes:

> Jeg vil meget gerne have valideret på klientsiden hvilken
> skærmopløsning brugeren har: 800x600, 1024x768 eller 1280x1024, og vil
> så gerne ha' at stylesheet'et bliver udskiftet alt efter resultatet af
> opløsningentjekket.

Ud over de argumenter der allerede er give mod at basere noget som helst
på skærmens størrelse, så skal man også huske at tage højde for:
- Skærme kan have mange andre dimensioner end de tre du har der (fx
1440x1152 eller 1600x1200, jeg har haft begge), så enhver test skal
være for intervaller, ikke eksakte tal. Og man bør kun kigge på bredden.

- Selv hvis man bruger browserens bredde, så skal brugeren også kunne
resize sin browser, og, helst, stadig bruge siden. Det taler igen for
et flydende design.


Jeg kan forstå at man har forskellige størrelser af billeder der
bruges ved forskellige browser-bredder.
Til det kunne man have et stort stylesheet der ændrer billedstørrelser
efter, fx, class på body. I.e., en selector der ligner:
body #myDiv { background-image: url(default.png); }
body.stor #myDiv { background-image: url(stor.png); }
body.lille #myDiv { background-image: url(lille.png); }

Så kan man nøjes med at sætte document.body.className efter størrelsen,
og man kan endda opdatere den nemt på onresize.

Det er dog måske lidt for kompliceret i praksis :)

/L
--
Lasse Reichstein Holst Nielsen
DHTML Death Colors: <URL:http://www.infimum.dk/HTML/rasterTriangleDOM.html>
'Faith without judgement merely degrades the spirit divine.'

Søg
Reklame
Statistik
Spørgsmål : 177578
Tips : 31968
Nyheder : 719565
Indlæg : 6409072
Brugere : 218888

Månedens bedste
Årets bedste
Sidste års bedste