Hvordan kan man på 100% sikker måde få brugerens skærmbredde

problemet er at dette er umuligt. (så vidt jeg ved) mange af de folk der kører med en højere opløsning end 1024x768 bruger ikke hele skærmen som vindue, men har tit 2 sider åben ved siden af hinanden f.eks. derfor vil det  være næsten umulig at være 100% sikker hver gang, du kan læse mere om det her http://www.html.dk/artikler/00025/ og http://www.html.dk/artikler/00023/

Du kan bede brugeren indtaste sin skærmbredde i en form ;o)

fucking pis, jag havde skrevet en hel roman og den forsvandt da jeg trykkede send?

prøver lige igen :-(

kan men ikke lave en function i java der evaluerer hvor bred browseren er?
noget lign:

feks noget man sætter ind i <body>'en som dette:
onbrowsersizechange="update_side_with();"

eller:
onchange="update_side_with();"

så kunne man lave en function som denne:
function update_side_with(tablewidth){
  var browsersize = hvor bred er browseren;
  if (browsersize <= 550){var percent = 100;}else{
    if (browsersize <= 650){var percent = 98;}else{
      if (browsersize <= 750){var percent = 97;}else{
        if (browsersize <= 850){var percent = 95;}else{
          if (browsersize <= 950){var percent = 92;}else{
            if (browsersize <= 1050){var percent = 90;}else{
              if (browsersize <= 1200){var percent = 88;}else{
                if (browsersize <= 1400){var percent = 78;}else{
                  if (browsersize <= 1600){var percent = 70;}else{
                    var percent = 68;
                  }
                }
              }
            }
          }
        }
      }
    }
  }
  var width = browsersize;
  genopfrisk siden med de nye variabler/værdier(som er width og percent)
}

ps siden må ikke miste indtastede data i felter osv, når den opdaterer!..

håber det kan laves og du vil hjælpe mig! :-)

På forhånd tusind tak!

skal være:
function update_side_with(){

det skal selvfølgelig sættes ind et sted :-) og det er heri:
Jeg ved ik hvordan jeg skal skrive det, og har derfor skrevet det som php ;-)

<body onbrowsersizechange="update_side_with();">
<table width="100%" height="100%" cellpadding="0" cellspacing="0">
  <tr>
    <td width="<?php echo width; ?>"
      <table width="<?php echo percent."%"; ?>" height="100%" align="center">
        <tr>
          <td>
            siden
          </td>
        </tr>
osv..

og denne function findes nok ikke :-) "onbrowsersizechange" men måske kan du fortælle mig hvad jeg så skal skrive ?

mange tak

Der er intet der er 100% sikkert. Denne burde dog virke i NS4+ og IE5+:

<?php

    session_start();

    if ( isset( $_GET['scrx'] ) && isset( $_GET['scry'] ) )
    {
        $_SESSION['screenres'] = array( $_GET['scrx'], $_GET['scry'] );
        exit;
    }

    if ( !isset( $_SESSION['screenres'] ) )
    {

?>
<html>
    <head>
        <title>Measuring screen resolution</title>
        <script type="text/javascript">
            window.onload = function()
            {
                var im = new Image();
                im.src = '<?= $_SERVER['SCRIPT_NAME'] ?>?scrx=' + screen.width + '&scry=' + screen.height;
                setTimeout( "document.location.reload(1)", 500 );
            }
        </script>
    </head>
    <body>
    </body>
</html>
<?php
        exit;
    }

?>
<html>
    <head>
        <title>Welcome!</title>
    </head>
    <body>
        <h1>Welcome!</h1>
        <p>You are running at <?= $_SESSION['screenres'][0] . "x" . $_SESSION['screenres'][1] ?>!</p>
    </body>
</html>

Kan man ik os bruge at sætte den i <body>'en som feks

<body onResize="function update_side_with()">

Måske bare i <head> lave en:

<script type="text/javascript">
  window.onresize = function ()
  {
    // din funktion
  }
</script>

ok, er det bedre?

og man skal vel os huske at sætte den til at køre den når siden loades os. altså:
som du skriver:
window.onload = function()

korrekt opfattet?

yeps :) Evt:

<script type="text/javascript">
  function update_side_with()
  {
    // Din kode
  }
  window.onresize = function ()
  {
    update_side_with();
  }
  window.onload = function ()
  {
    update_side_with();
  }
</script>

er det rigtigt opfattet at du har lavet dit eksempel sådan at den tjekker om det er muligt for browseren, og hvis det er, så viser den en side, og hvis det ikke er muligt, så viser den en anden side. korrekt opfattet?

Det eksempel jeg gav tidligere? Nej... Først loader den siden, hvis $_SESSION['screenres'] ikke er sat så smider den en lille side med et javascript der kalder scriptet selv og sætter sessionsvariablen, så reloader den siden... Det kan sikkert gøres mere elegant ;)

ok, tak! Men når den reloader, smider den så alt det væk som brugeren har indtastet?

Den reloader når man kommer ind på siden, så brugeren skulle ikke have haft nogen mulighed for at indtaste noget ;)

Og den reloader kun én gang, så ved den hvor stor skærmen er - hvis deres browser vil fortælle screen.width og height altså! :)

er screen.width ik browserens bredde? eller er det skærmbredden?

setTimeout( "document.location.reload(1)", 500 );

Betyder det ik at den om lidt timer-out og reloader siden igen?

og hvor længe er 500? :-)
kan man ik sætte den til 1 så går der vel kortere tid eller hvad?

men eller er det super :-) Jeg knokler på det

tallet er millisekunder, så 500 er ½ sekund !-)

og så dog, det duer jo ik helt alligevel, for hvis brugeren resize'er så gen-loades siden og det indtastede går tabt. Æv!

NU tror jeg jeg har fattet hvad du vil. Du skal slet ikke bruge php, men javascript/dhtml. Noget i stil med:

<html>
    <head>
        <title>test</title>
        <script type="text/javascript">
          function fixWidth()
          {
            var width = ( window.outerWidth ? window.outerWidth : document.body.clientWidth );
            if ( width <= 550 )
            {
              percent = 100;
            }
            else if ( width <= 650 )
            {
              percent = 98;
            }
            else if ( width <= 750 )
            {
              percent = 97;
            }
            else if ( width <= 850 )
            {
              percent = 95;
            }
            else if ( width <= 950 )
            {
              percent = 92;
            }
            else if ( width <= 1050 )
            {
              percent = 90;
            }
            else if ( width <= 1200 )
            {
              percent = 88;
            }
            else if ( width <= 1400 )
            {
              percent = 78;
            }
            else if ( width <= 1600 )
            {
              percent = 68;
            }
            tab = document.getElementById( "mintabel" );
            tab.style.width = percent + '%';
          }

          window.onload = function ()
          {
              fixWidth();
          }
          window.onresize = function ()
          {
              fixWidth();
          }
        </script>
    </head>
    <body>
        <table id="mintabel" height="100%" align="center" border="1">
            <tr>
                <td>hej</td>
            </tr>
        </table>
    </body>
</html>

Den reloader heller ikke siden...

det ser mere rigtigt ud, tusind tak for det! jeg skriver lige når jeg har lavet det færdigt eller jeg forsøger ihvertfald lige at integrere det i min side. Skal først lige have det andet væk igen :-)

Men tusind tak indtil videre, du aner ik hvor glad jeg er for din hjælp :-)
Java er helt nyt for mig og jeg har jo kun programmeret i ca 3 måneder, så der er så meget jeg skal lære hele tiden. Uden lidt sparring havde jeg sku givet op for længst. Så jeg er yderst taknemmelig for alt den hjælp man kan få herinde. Tak :-)

Michael

Jeg kender heller ikke den allerfjeneste bid java, men hvis du ikke havde accepteret php-scriptet som et alternativ først på eftermiddagen, kunne jeg sagtens have hjulpet dig med de 4-5 javascript- og html-koder du manglede i et rimeligt fornuftigt script, som kun havde den eneste alvorlige fejl, at du lavede en hel ny forgrening i stedet for at bare at give forgreningen en ny gren ...

Java og javascript har groft sagt kun 4 ting tilfælles: j - a - v - a !-)

Nå, jo, og så nogle syntaks-ting, som php stort set også deler ...

Hvad sker der her? og hvorfor et ?-tegn

var width = ( window.outerWidth ? window.outerWidth : document.body.clientWidth );

skal jeg helst gøre sådan:
<body onresize="fixWidth()" onload="fixWidth()">


Eller sådan:
window.onload = function (){  fixWidth();}
window.onresize = function (){  fixWidth();}

eller er det sådan:
window.onload = fixWidth();
window.onresize = fixWidth();

Jeg kan nemilg ik få det til at virke rigtigt

Alle disse virker:

<body onresize="fixWidth()" onload="fixWidth()">

og

window.onload = function (){  fixWidth();}
window.onresize = function (){  fixWidth();}

og

window.onload = fixWidth;
window.onresize = fixWidth;

Den sidste er nok den smarteste ville jeg sige... Jeg bruger dog ofte #2, hvis der er yderligere ting ud over den ene funktion der skal køres/kaldes.

JUBIIIII, nu kører det bare for vildt :-)

Det virker kanont nu!

Jeg mangler kun at indbygge noget php der tjekker om browseren kan handle javascriptet. hvis ikke, skal php sætte værdierne fast og udelukke javascriptet.
Såå, det kunne jeg faktisk godt bruge hjælp til :-)

Men her er det hele i færdig udgave!

Siden justerer sig i center og tilpasser sig optimalt til browseren. Jeg er kanonglad for det! Håber os andre kan få glæde af det! :-)

<html>
<head>
<title>test</title>
<?php
if (kan klare det?){$can_handle_fixWidth=true;}
if ($can_handle_fixWidth){ ?>
<script language="javascript" type="text/javascript">
var WindowWidth;
var percent;
function fixWidth(){
  WindowWidth=(window.outerWidth ? window.outerWidth : document.body.clientWidth);
  if ( WindowWidth <= 550 )    {percent = '100';}
    else if ( WindowWidth <= 600 )    {percent = '100';}
    else if ( WindowWidth <= 650 )    {percent = '99';}
    else if ( WindowWidth <= 700 )    {percent = '98';}
    else if ( WindowWidth <= 750 )    {percent = '96';}
    else if ( WindowWidth <= 800 )    {percent = '95';}
    else if ( WindowWidth <= 850 )    {percent = '93';}
    else if ( WindowWidth <= 900 )    {percent = '92';}
    else if ( WindowWidth <= 950 )    {percent = '91';}
    else if ( WindowWidth <= 1000 )    {percent = '89';}
    else if ( WindowWidth <= 1050 )    {percent = '88';}
    else if ( WindowWidth <= 1100 )    {percent = '87';}
    else if ( WindowWidth <= 1150 )    {percent = '86';}
    else if ( WindowWidth <= 1200 )    {percent = '84';}
    else if ( WindowWidth <= 1250 )    {percent = '82';}
    else if ( WindowWidth <= 1300 )    {percent = '80';}
    else if ( WindowWidth <= 1350 )    {percent = '78';}
    else if ( WindowWidth <= 1400 )    {percent = '76';}
    else if ( WindowWidth <= 1450 )    {percent = '73';}
    else if ( WindowWidth <= 1500 )    {percent = '70';}
    else if ( WindowWidth <= 1550 )    {percent = '69';}
    else if ( WindowWidth <= 1600 )    {percent = '67';}
    else if ( WindowWidth > 1600 )    {percent = '65';}
    document.getElementById("maxbredde").style.width = WindowWidth + 'px';
    document.getElementById("percent").style.width = percent + '%';
  }
</script>
<?php
}?>
</head>

<body <?php if ($can_handle_fixWidth){echo "onresize=\"fixWidth()\" onload=\"fixWidth()\""; ?>>
<table width="100%" height="100%" cellpadding="0" cellspacing="0">
    <tr>
        <td id="maxbredde" <?php if (!$can_handle_fixWidth){echo "width=\"1050\""; ?>>
            <table id="percent" height="100%" align="center" <?php if (!$can_handle_fixWidth){echo "width=\"92%\""; ?>>
                <tr>
                    <td bgcolor="#666688">
                        tekst ii i ii i tekst ii i ii i
                        tekst ii i ii i tekst ii i ii i
                        tekst ii i ii i tekst ii i ii i
                        tekst ii i ii i tekst ii i ii i
                    </td>
                </tr>
            </table>
        </td>
    </tr>
</table>
</body>
</html>

skriv endelig hvis du kan lave den php der tjekker om browseren kan klare javascriptet

ja, der mangler lige  3 }-tegn i body, td og table :-)

"Jeg mangler kun at indbygge noget php der tjekker om browseren kan handle javascriptet. hvis ikke, skal php sætte værdierne fast og udelukke javascriptet.
Såå, det kunne jeg faktisk godt bruge hjælp til :-)"

Ikke nødvendigt. Drop de if-sætninger, smid altid javascriptet på, men sæt din maxbredde TD og din "percent" tabel's bredde i HTML'en til at starte med. Hvis browseren ikke kan køre javascriptet kan du så bare være ligeglad, så er den de rigtige bredder :)

he :-) kanont simpelt, det troede jeg ik man kunne. Jeg laver det lige og paster igen herinde.

Men Tusind tak coderdk jeg er megaglad for det, jeg har ønsket mig og forsøgt i flere måneder...

<html>
<head>
<title>test</title>
<script language="javascript" type="text/javascript">
var WindowWidth;
var percent;
function fixWidth(){
    WindowWidth = ( window.outerWidth ? window.outerWidth : document.body.clientWidth );
    if ( WindowWidth <= 550 )        {percent = '100';}
    else if ( WindowWidth <= 600 )    {percent = '100';}
    else if ( WindowWidth <= 650 )    {percent = '99';}
    else if ( WindowWidth <= 700 )    {percent = '98';}
    else if ( WindowWidth <= 750 )    {percent = '96';}
    else if ( WindowWidth <= 800 )    {percent = '95';}
    else if ( WindowWidth <= 850 )    {percent = '93';}
    else if ( WindowWidth <= 900 )    {percent = '91';}
    else if ( WindowWidth <= 950 )    {percent = '90';}
    else if ( WindowWidth <= 1000 )    {percent = '88';}
    else if ( WindowWidth <= 1050 )    {percent = '87';}
    else if ( WindowWidth <= 1100 )    {percent = '85';}
    else if ( WindowWidth <= 1150 )    {percent = '83';}
    else if ( WindowWidth <= 1200 )    {percent = '80';}
    else if ( WindowWidth <= 1250 )    {percent = '78';}
    else if ( WindowWidth <= 1300 )    {percent = '76';}
    else if ( WindowWidth <= 1350 )    {percent = '74';}
    else if ( WindowWidth <= 1400 )    {percent = '72';}
    else if ( WindowWidth <= 1450 )    {percent = '70';}
    else if ( WindowWidth <= 1500 )    {percent = '68';}
    else if ( WindowWidth <= 1550 )    {percent = '66';}
    else if ( WindowWidth <= 1600 )    {percent = '65';}
    else if ( WindowWidth > 1600 )    {percent = '63';}
    document.getElementById("maxbredde").style.width = WindowWidth + 'px';
    document.getElementById("percent").style.width = percent + '%';
}
</script>
</head>
<body onresize="fixWidth()" onload="fixWidth()">
<table width="100%" height="100%" cellpadding="0" cellspacing="0">
    <tr>
        <td id="maxbredde" width="1050">
            <table id="percent" width="93%" height="100%" align="center">
                <tr>
                    <td bgcolor="#666688">
                        tekst ii i ii i tekst ii i ii i tekst
                        tekst ii i ii i tekst ii i ii i tekst
                        tekst ii i ii i tekst ii i ii i tekst
                        tekst ii i ii i tekst ii i ii i tekst
                    </td>
                </tr>
            </table>
        </td>
    </tr>
</table>
</body>
</html>

Håber nogen vil teste den i en opløsning over 1024 X 1280, for jeg kan ikke :-)
Skriv endelig hvis der er noget ellers.

Michael

<table width="100%" height="100%" cellpadding="0" cellspacing="0">
    <tr>
        <td id="maxbredde" width="1050">


Dét der virker lidt underligt... Men det ser ud til at virke - jeg kører 1600x1200

:o) jep, det er lidt specielt! :o)

siden bliver aldrig vildt bred, men for brugere med lille skærm udnytter den alt plads! Jeg synes selv det er ret genialt layout. (hvis man ik vil klaske en masse frames og reklame ind på siden.

Jeg er GLAD :-)

Hvis jeg skulle klage over noget nu,:-) så er det at hele min side blinker meget når man forøger størrelsen på browseren. Kan man gøre noget ved det?

Jeg må rose learner for at bringe det endelige resultat efter de fælles anstrengelser.

Meget lærerigt.