Avatar billede prankster Nybegynder
15. marts 2002 - 09:18 Der er 9 kommentarer

Ændre menu efter brugerens opløsning!

Hej alle sammen...

Hvordan får jeg min menu til at reagere på brugerens opløsning/browser størrelse?

Her er hvad jeg har lavet:
--------------------------------------------------

<link rel="stylesheet" type="text/css" href="Style.css">

<body>

<script language="Javascript">
<!--

if(screen.availWidth <= 800 && screen.availHeight <= 600)

document.write("<table width='100%' height='100%' background='/Test/Site-bin/images/Menu.png'>");
document.write("          <tr>");
document.write("            <td valign='top'>");
document.write("                <br><br><br><br><br>");
document.write("              &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<a href='#' onClick='top.main.location.href=/Test/Site-bin/Forside.asp;' onMouseover='window.status=GÅ TIL HOME;return true;' onMouseout='window.status=;return true;'>Home</a>");
document.write("              <br>");
document.write("              &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<a href='#' onClick='top.main.location.href =/Test/Site-bin/Om-mig.asp;' onMouseover='window.status=LÆS OM MIG;return true;' onMouseout='window.status=;return true;'>Om mig</a>");
document.write("              <br>");
document.write("              &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<a href='#' onClick='top.main.location.href =/Test/Site-bin/Kontakt.asp;' onMouseover='window.status=KONTAKT MIG;return true;' onMouseout='window.status=;return true;'>Kontakt</a>");
document.write("            <br><br><br><br><br><br>");
document.write("              <center>");
document.write("                  <!-- Chart Basis HTML kode start v001 --> ");
document.write("                  <a target='_blank' href='http://www.chart.dk/ref.asp?id=57675'> ");
document.write("                  <img alt='Chart.dk' border='0' src='http://cluster.chart.dk/chart.asp?id=57675'> ");
document.write("                  </a>");
document.write("                  <!-- Chart Basis HTML kode slut v001 -->");
document.write("            <br>");
document.write("                  <a href='http://www.ratings.dk/func/enter.asp?id=4355' target='_blank'><img src='http://www.ratings.dk/func/logo.asp?id=4355' alt='Ratings.dk' border=0></a>");
document.write("              </center>");
document.write("              </td>");
document.write("        </tr>");
document.write("</table>");

Else

document.write("hej");

-->
</script>

</body>
--------------------------------------------------

Håber i kan hjælpe mig med at lave en menu der kan reagere på brugerens opløsning/browser størrelse! =)=)=)=)=)=)=)

/Prankster
Avatar billede jakoba Nybegynder
15. marts 2002 - 10:30 #1
det du måler med screen.availWidth et brugerens skærm.

Browservinduets størrelse kan du aflæse i

IE (og kun IE)
    document.body.clientWidth;
    document.body.clientHeight;

NS, Opera, (HTML standard browsere)
    window.innerWidth;
    window.innerHeight;

Pas på når du laver browsercheck for IE. Opera har et .all array og lader ofte også i navigator.appName somom den er en IE, men den bruger altså innerWidth og innerHeight.
Den sikreste check er nok:

if ( window.innerWidth ) {
            // fra og med javascript version 1.2
            // ( dvs vers 4 af NS, IE og Opera )
    browserBredde = window.innerWidth;
} else {
    browserBredde = dodument.body.clientWidth;
}

mvh JakobA
Avatar billede prankster Nybegynder
15. marts 2002 - 10:36 #2
Prøv at lave et udkast til hvordan mit script skulle se ud! =)

PÅ FORHÅND TAK!

/Prankster
Avatar billede jakoba Nybegynder
15. marts 2002 - 10:58 #3
Nej. Det forekommer lidt fjollet med alle de document.write sætninger du har og de gør din menu helt uoverskuelig.
Avatar billede prankster Nybegynder
16. marts 2002 - 15:36 #4
Det må du da undskylde! :(

Prøv bare at lave et script der skriver "800*600 eller mindre" hvis opløsningen er mindre eller lig med 800*600, og "1024*768 eller mindre" hvis den er større! =)

TAK!
Avatar billede jakoba Nybegynder
17. marts 2002 - 04:40 #5
Men opløsningen på brugerens SKÆRM er irellevant.

Det der betyder noget er størrelsen på det browservindue han giver dig at vise siden i.

Nå men hvis du vil have det:

if ( screen.width < 801 ) {
    document.write( "800*600 eller mindre" );
} else {
    document.write( "1024*768 eller mindre" );

PS: jeg har også lidt problemer med "1024*768 eller mindre". Dels findes der meget større skærme (IBM har en på 3600*2400) dels er der det vi ser som den 'normale'- række (dvs: 640*480, 800*600, 1024*768, ...) slet ikke en standard. Der er masser af formater indimellem.

mvh JakobA
Avatar billede jakoba Nybegynder
17. marts 2002 - 04:41 #6
Ups.  irellevant -> irrelevant
Avatar billede bidetus Nybegynder
17. marts 2002 - 04:53 #7
Det kommer jo an på hvor grundig man vil være.

=D

P.S. Natteravn =)
Avatar billede prankster Nybegynder
17. marts 2002 - 09:46 #8
Jeg kan altså ikke få det til at virke! =)
Og prøv at lave et csript med både HØJDE og BREDDE, TAK =)
Avatar billede Kengun Praktikant
18. marts 2002 - 11:38 #9
Det bliver nok dessverre ingen points utdelet fra Pranktster i dette spørgsmål. Prankster er blevet deaktiveret. Se lige her: http://www.eksperten.dk/spm/186501
Avatar billede Ny bruger Nybegynder

Din løsning...

Tilladte BB-code-tags: [b]fed[/b] [i]kursiv[/i] [u]understreget[/u] Web- og emailadresser omdannes automatisk til links. Der sættes "nofollow" på alle links.

Loading billede Opret Preview
Kategori
Vi tilbyder markedets bedste kurser inden for webudvikling

Log ind eller opret profil

Hov!

For at kunne deltage på Computerworld Eksperten skal du være logget ind.

Det er heldigvis nemt at oprette en bruger: Det tager to minutter og du kan vælge at bruge enten e-mail, Facebook eller Google som login.

Du kan også logge ind via nedenstående tjenester