redirect na resolutie check!?

Status
Niet open voor verdere reacties.

Wim van Heugten

Gebruiker
Lid geworden
28 aug 2007
Berichten
5
Ik ben op zoek naar een script die bij 1024x768 en lager doorlinkt naar de ene pagina en als het een hogere resolutie is dan dat, dan moet deze automatisch doorlinken naar een andere pagina... nu heb ik dit script gevonden, maar ik krijg het niet werkend :confused:
kan iemand me hier mee helpen, of heeft iemand een beter script?

<SCRIPT LANGUAGE="JavaScript">

<!-- Begin
function redirectPage() {
var url640x480 = "indexlinks640.html";
var url800x600 = "indexlinks800.html";
var url1024x768 = "indexlinks1024.html";
if ((screen.width == 640) && (screen.height == 480))
window.location.href= url640x480;
else if ((screen.width == 800) && (screen.height == 600))
window.location.href= url800x600;
else if ((screen.width == 1024) && (screen.height == 768))
window.location.href= url1024x768;
else window.location.href= url640x480;
}
// End -->
</script>
 
Ik zou het afraden om een resolutie check te gebruiken. Javascript is om te beginnen niet betrouwbaar en daarnaast is een pagina reload niet gebruikersvriendelijk. Het beste kun je je site ontwerpen voor een lage resolutie, dan kun je er altijd voor zorgen dat hij er goed uit ziet in hogere resoluties.

Maar, wil je het toch, dan is het window.screen.width, niet screen.widt. Maar dit is geen onderdeel van de standaard en wordt dus ook niet geacht te werken. IE en FF ondersteunen het, maar er is geen garantie dat elke browser dat doet. Nog een rede dus om je site gewoon voor lage resoluties te ontwerpen.
 
In welke browser bekijk je het?

Uit ervaring weet ik dat een soortgelijk script alleen in IE werkt.
In de rest krijg je gewoon een witte pagina.

Ik vraag me daarnaast af waarom je als alle IF-statements FALSE zijn je de 640x480 URL doorgeeft? Als ik dus met 1280x1024 je site bekijk dan krijg ik die 640x480 pagina terwijl ik makkelijk de 1024 kan bekijken.

Ook moet je de functie in je <body> aanroepen.

PHP:
<body onload="redirectPage()">

edit: Glest zie http://www.javascriptkit.com/howto/newtech3.shtml, ook screen.width en schijnt te werken.
 
In de Gecko DOM refrence staat window.screen:
http://developer.mozilla.org/En/DOM:window.screen

Het maakt niet veel uit waar je de functie aanroept. Hoe eerder hoe beter zou ik zeggen. Als je wacht tot onload dan is de hele pagina al geladen. Een verspilling van bandwidth als je het mij vraagt. Ik zou het meteen in de header al aanroepen.
 
Laatst bewerkt:
thanks voor de reacties, het is me alleen nog niet echt duidelijk....(ik heb niet heel veel verstand van websites bouwen e.d.)

Ik zal het even verder uitleggen. Ik heb 2 website versies:
1 voor monitors boven 1024x768
2 monitors voor 1024x768 en lager

Ik moet dus iets hebben dat automatisch doorstuurt naar de website die geschikt is, en dat moet t doen in vrijwel elke browser. Ik zit zelf op een mac en heb safari (en firefox)

Het script wat ik eerder gaf heb ik van internet geplukt, en zelf wel veranderd maar ik heb het "origineel" hier geplaatst.

Hoe zit dat met DOM? noem mij maar dom :D, maar ik weet niet eens hoe ik dat aanroep of waar en hoe ik dat moet plaatsen... (ik ga overigens nog wel even op die site kijken...)
 
Je kan in plaats van een is (=) gewoon een groterdan (>) of kleinerdan(<) gebruiken. Bovendien kan je de groter-of-gelijkaan en kleiner-of-gelijkaan gebruiken (>= en <=)

Dus, zoiets:
PHP:
//javascripts!

var swidth = screen.width;      //als dit niet werkt kan je het makkelijker aanpassen
var sheight = screen.height;   //bv. veranderen in, zoals al gezegt werd,
                               //window.screen.witdh ofzo. Of maak
                               //een functie die ze bijde controleert.

if( (swidth <= 1024) && (sheight <= 768) )
{
    //re-locate voor geleijkaan of kleinderdan 1024 bij 768
    window.location.href = "kleinerdan.html";
}else{
    //re-locate voor groterdan 1024 bij 768
    window.location.href = "groterdan.html";
}

even uit het hoofd, maar zoiets zou de oplossing moeten zijn. Verder: ik heb voor een website screen.width gebruikt en bekeken met wat verschillende browsers, maar het schijnt goed te werken. Het enige is dat je op laptops wat vreemde weergave krijgt soms omdat die breedtbeeld zijn (die van mij in ieder geval).

Waar je ook op moet letten is dat er dus ook beeldschermen zijn die KLEINER zijn dan 1024 in breedte, maar GROTER dan 768 in hoogte of andersom (bv. laptops, breedbeeld). Die komen dus door de loop heen als 'else'. Mischien moet je daar ook nog maar eens naar kijken, bv. door een 'elseif' te gebruiken oid.

:thumb:


[edit] voor DOM, check Glest's sig, staan genoeg links in ;)[/edit]
 
Laatst bewerkt:
Meestal maakt bij het ontwerp van je site niet uit wat de resolutie hoogte is. De breedte is meestal de beperkende factor. Naar beneden scrollen is geen probleem, opzij scrollen is irritant. Dus misschien kun je ook gewoon de hoogte negeren en alleen naar de breedte kijken.

Waar je trouwens met het oog op gebruikersvriendelijkheid op moet letten is dat je index pagina de kleine resolutie is met een script wat redirect naar je grotere versie indien de resolutie hoog genoeg is. Dit voor het geval de gebruiker geen javascrip ondersteund. En die redirect moet in de <head> komen. Als je hem in de onload zet zou het kunnen dat de gebruiker na bijvoorbeeld 20 seconden pas geredirect wordt.

Maar, nog steeds, de beste oplossing is gewoon een site die in lage en hoge resoluties er goed uit ziet.

window.screen bestaat in Firefox en IE, dus gebruik die maar gewoon, dan heb je daar geen last meer van.
http://msdn.microsoft.com/en-us/library/ms535873(VS.85).aspx# en dan op objects klikken
 
Laatst bewerkt:
Status
Niet open voor verdere reacties.
Terug
Bovenaan Onderaan