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

Kodeord


Reklame
Top 10 brugere
HTML
#NavnPoint
molokyle 11184
Klaudi 5506
bentjuul 3377
severino 2040
smorch 1950
strarup 1525
natmaden 1396
scootergr.. 1320
e.c 1150
10  miritdk 1110
Er height som % af width (eller omvendt) m~
Fra : Thor


Dato : 10-09-03 15:49

Som overskriften antyder vil jeg gerne lave en tabel, hvor højden
følger browservinduets bredde. Dette er for at få samme
størrelsesforhold elementerne imellem, uden at lave ablolut
højde/bredde angivet i pixels.

Kan man det med html/css?

Hvis vi nu siger at nedenstående tabels højde skal være 21% af
browservinduets bredde (som også er tabelles bredde da den er
100%), hvad skal jeg så skrive på ?'s plads? Løsning i stylesheet
er også meget velkommen. :)

<table width="100%" height="?">
<tr>
<td>xxx<td>
</tr>
</table>

Få forhånd "tag" for svar ;)

--
Vil du lære at kode HTML, XHTML, CSS, SSI eller ASP?
- Pædagogiske tutorials på dansk
- Kom godt i gang med koderne
KLIK HER! => http://www.html.dk/tutorials

 
 
Martin Hintzmann And~ (10-09-2003)
Kommentar
Fra : Martin Hintzmann And~


Dato : 10-09-03 16:04

Thor wrote:
> Som overskriften antyder vil jeg gerne lave en tabel, hvor højden
> følger browservinduets bredde. Dette er for at få samme
> størrelsesforhold elementerne imellem, uden at lave ablolut
> højde/bredde angivet i pixels.
>
> Kan man det med html/css?

Nej, du skal benytte JavaScript til dette.

>
> Hvis vi nu siger at nedenstående tabels højde skal være 21% af
> browservinduets bredde (som også er tabelles bredde da den er
> 100%), hvad skal jeg så skrive på ?'s plads? Løsning i stylesheet
> er også meget velkommen. :)
>
> <table width="100%" height="?">
> <tr>
> <td>xxx<td>
> </tr>
> </table>
>

Noget a lá nedenstående:
document.getElementById('TABELLENSID').style.height = (
document.getElementById('TABELLENSID').offsetWidth / 100) * 21 );

Hintzmann c",)


Thor (11-09-2003)
Kommentar
Fra : Thor


Dato : 11-09-03 12:57

Tusind tak, jeg vil prøve at pusle med dit script, selvom jeg desværre
er helt grøn ud i Java. Hvis jeg nu benævner min tabel "tb1" og
skriver:

<table id="tb1" height="document.getElementById('tb1').style.height =
(document.getElementById('tb1').offsetWidth / 100) * 21 );">
<tr>
<td>xxx<td>
</tr>
</table>

I mit stylesheet:

#tb1
{
   width: 100%;
   background-color: #CCFFFF;
}

Er det så nok, eller er jeg helt galt afmarcheret?


Martin Hintzmann Andersen wrote in dk.edb.internet.webdesign.html:
> Thor wrote:
> > Som overskriften antyder vil jeg gerne lave en tabel, hvor højden
> > følger browservinduets bredde. Dette er for at få samme
> > størrelsesforhold elementerne imellem, uden at lave ablolut
> > højde/bredde angivet i pixels.
> >
> > Kan man det med html/css?
>
> Nej, du skal benytte JavaScript til dette.
>
> >
> > Hvis vi nu siger at nedenstående tabels højde skal være 21% af
> > browservinduets bredde (som også er tabelles bredde da den er
> > 100%), hvad skal jeg så skrive på ?'s plads? Løsning i stylesheet
> > er også meget velkommen. :)
> >
> > <table width="100%" height="?">
> > <tr>
> > <td>xxx<td>
> > </tr>
> > </table>
> >
>
> Noget a lá nedenstående:
> document.getElementById('TABELLENSID').style.height = (
> document.getElementById('TABELLENSID').offsetWidth / 100) * 21 );
>
> Hintzmann c",)
>


--
Vil du lære at kode HTML, XHTML, CSS, SSI eller ASP?
- Pædagogiske tutorials på dansk
- Kom godt i gang med koderne
KLIK HER! => http://www.html.dk/tutorials

Anders Thorsen Holm (11-09-2003)
Kommentar
Fra : Anders Thorsen Holm


Dato : 11-09-03 13:23

Thor wrote:

> Tusind tak, jeg vil prøve at pusle med dit script, selvom jeg
> desværre er helt grøn ud i Java.

Det er heller ikke Java, men JavaScript - det er to vidt forskellige
ting

Jeg kunne vel ikke overtale dig til at klippe lidt i dine indlæg og
skrive under det, du svarer på? Det vil gøre dine indlæg noget
nemmere for andre at læse og besvare:

<http://www.usenet.dk/netikette/citatteknik.html>

--
Anders Thorsen Holm | http://www.daimi.au.dk/~zoolook/

Overvejer du at købe en DVD-afspiller? Så hold dig fra Fona!
Læs hvorfor: http://www.daimi.au.dk/~zoolook/fona/

Thor (11-09-2003)
Kommentar
Fra : Thor


Dato : 11-09-03 14:08

Anders Thorsen Holm wrote in dk.edb.internet.webdesign.html:
> Thor wrote:
>
> > Tusind tak, jeg vil prøve at pusle med dit script, selvom jeg
> > desværre er helt grøn ud i Java.
>
> Det er heller ikke Java, men JavaScript - det er to vidt forskellige
> ting
>
> Jeg kunne vel ikke overtale dig til at klippe lidt i dine indlæg og
> skrive under det, du svarer på? Det vil gøre dine indlæg noget
> nemmere for andre at læse og besvare:
>
> <http://www.usenet.dk/netikette/citatteknik.html>
>
> --
> Anders Thorsen Holm http://www.daimi.au.dk/~zoolook/
>
---
Hmmm, begge dele siger vist desværre noget om hvor grøn jeg er...men
jeg er her jo heldigvis for at lære...

--
Vil du lære at kode HTML, XHTML, CSS, SSI eller ASP?
- Pædagogiske tutorials på dansk
- Kom godt i gang med koderne
KLIK HER! => http://www.html.dk/tutorials

Martin Hintzmann And~ (11-09-2003)
Kommentar
Fra : Martin Hintzmann And~


Dato : 11-09-03 13:27

Thor wrote:
> Tusind tak, jeg vil prøve at pusle med dit script, selvom jeg desværre
> er helt grøn ud i Java.

Blot til information, så er Java er _ikke_ det samme som JavaScript.

> Hvis jeg nu benævner min tabel "tb1" og skriver:
>

[snip kode]

>
> Er det så nok, eller er jeg helt galt afmarcheret?
>

Du kan ikke bruge javascript i attributten height på tabel elementet. Skriv det i stedet i en
script blok.

Du skal skrive noget a lá nedenstående:

<style type="text/css">
#tb1 {
   width: 100%;
   background-color: #CCFFFF;
}
</style>
<table id="tb1">
<tr>
<td>xxx<td>
</tr>
</table>
<script type="text/javascript">
   document.getElementById('tb1').style.height = ((document.getElementById('tb1').offsetWidth /
100) * 21 );
</script>

Jeg vil lige gøre dig opmærksom på, at bruge javascript til designe/layoute sin side, er en
dårlig vej at bevæge sig ned af.
Layout skal holdes i et stylesheet og funktion i et javascript.
Men da dit specifikke ønske ikke kan lade sig gøre i almindelig CSS, er det vel okay for denne
ene gang. Men prøv at hold dem adskilt


Hintzmann c",)






Thor (11-09-2003)
Kommentar
Fra : Thor


Dato : 11-09-03 14:44

Martin Hintzmann Andersen wrote in dk.edb.internet.webdesign.html:
> Thor wrote:
> > Tusind tak, jeg vil prøve at pusle med dit script, selvom jeg desværre
> > er helt grøn ud i Java.
>
> Blot til information, så er Java er _ikke_ det samme som JavaScript.
>
> > Hvis jeg nu benævner min tabel "tb1" og skriver:
> >
>
> [snip kode]
>
> >
> > Er det så nok, eller er jeg helt galt afmarcheret?
> >
>
> Du kan ikke bruge javascript i attributten height på tabel elementet. Skriv det i stedet i en
> script blok.
>
> Du skal skrive noget a lá nedenstående:
>
> <style type="text/css">
> #tb1 {
>    width: 100%;
>    background-color: #CCFFFF;
> }
> </style>
> <table id="tb1">
> <tr>
> <td>xxx<td>
> </tr>
> </table>
> <script type="text/javascript">
>    document.getElementById('tb1').style.height = ((document.getElementById('tb1').offsetWidth /
> 100) * 21 );
> </script>
>
> Jeg vil lige gøre dig opmærksom på, at bruge javascript til designe/layoute sin side, er en
> dårlig vej at bevæge sig ned af.
> Layout skal holdes i et stylesheet og funktion i et javascript.
> Men da dit specifikke ønske ikke kan lade sig gøre i almindelig CSS, er det vel okay for denne
> ene gang. Men prøv at hold dem adskilt
>
>
> Hintzmann c",)
>
Ok, det vil jeg overveje. Uanset hvad, skal du have mange tak for din hjælp. Især da jeg godt
ved, at det kan være krævende at skulle skære tingene ud i pap for amatører som jeg selv... :)

--
Vil du lære at kode HTML, XHTML, CSS, SSI eller ASP?
- Pædagogiske tutorials på dansk
- Kom godt i gang med koderne
KLIK HER! => http://www.html.dk/tutorials

René Lønstrup (11-09-2003)
Kommentar
Fra : René Lønstrup


Dato : 11-09-03 15:10

Martin Hintzmann Andersen wrote:
> Du skal skrive noget a lá nedenstående:

<SNIP>

Dit script virker, men kun en gang per sideindlæsning. Hvis det skal gøres
dynamisk, i tilfælde af at brugeren resizer sin browser, skal der lidt mere
til.

Dette skulle gøre tricket:

<html>
<head>
<title>min side</title>
<style type="text/css">
#tb1 {width: 100%; background-color: #CCFFFF}
</style>
<script type="text/javascript">
function changeSize() {
// vær opmærksom på brudte linier
// nedenstående 2 skal stå på en linie
document.getElementById("tb1").style.height =
((document.getElementById("tb1").offsetWidth / 100) * 21 );
}
</script>
</head>
<body onload="changeSize();" onresize="changeSize();">
<table id="tb1">
<tr>
<td>xxx</td>
</tr>
</table>
</body>
</html>


--
Mvh René Lønstrup
min web: http://www.rel7star.dk?r=usenet
min email: se om du kan regne dén ud..



Thor (11-09-2003)
Kommentar
Fra : Thor


Dato : 11-09-03 16:28

René Lønstrup wrote in dk.edb.internet.webdesign.html:
> Martin Hintzmann Andersen wrote:
> > Du skal skrive noget a lá nedenstående:
>
> <SNIP>
>
> Dit script virker, men kun en gang per sideindlæsning. Hvis det skal gøres
> dynamisk, i tilfælde af at brugeren resizer sin browser, skal der lidt mere
> til.
>
> Dette skulle gøre tricket:
>
> <html>
> <head>
> <title>min side</title>
> <style type="text/css">
> #tb1 {width: 100%; background-color: #CCFFFF}
> </style>
> <script type="text/javascript">
> function changeSize() {
> // vær opmærksom på brudte linier
> // nedenstående 2 skal stå på en linie
> document.getElementById("tb1").style.height =
> ((document.getElementById("tb1").offsetWidth / 100) * 21 );
> }
> </script>
> </head>
> <body onload="changeSize();" onresize="changeSize();">
> <table id="tb1">
> <tr>
> <td>xxx</td>
> </tr>
> </table>
> </body>
> </html>
>
>
> --
Super at I er så hjælpsomme! Men jeg bilver lige nødt til at stille endnu et
n00b spørgsmål: Virker JavaScriptet først når siden er uploaded til en server
som understøtter dette? Jeg har forsøgt at få siden vist i IE 6.0 via Stone's
Webwriter 4 og FrontPage, men der virker det ikke rigtigt efter hensigten...

--
Vil du lære at kode HTML, XHTML, CSS, SSI eller ASP?
- Pædagogiske tutorials på dansk
- Kom godt i gang med koderne
KLIK HER! => http://www.html.dk/tutorials

Knud Gert Ellentoft (11-09-2003)
Kommentar
Fra : Knud Gert Ellentoft


Dato : 11-09-03 17:55

Thor <thor@mail-online.dk> skrev :

>Super at I er så hjælpsomme! Men jeg bilver lige nødt til at stille endnu et
>n00b spørgsmål: Virker JavaScriptet først når siden er uploaded til en server
>som understøtter dette? Jeg har forsøgt at få siden vist i IE 6.0 via Stone's
>Webwriter 4 og FrontPage, men der virker det ikke rigtigt efter hensigten...

Nej, det har ikke noget med serveren at gøre.
Javascript afvikles på brugerens computer.

PS.
Klip venligst i det du svarer på, der er ingen grund til at
citere hele det foregående svar, tak.
--
Knud

Thomas Dybdahl osv (11-09-2003)
Kommentar
Fra : Thomas Dybdahl osv


Dato : 11-09-03 06:35

<snip>
>
> <table width="100%" height="?">
> <tr>
> <td>xxx<td>
> </tr>
> </table>
>

<table style="width:100%; height:21%;">? Ellers med javascript

--
Vil du lære at kode HTML, XHTML, CSS, SSI eller ASP?
- Pædagogiske tutorials på dansk
- Kom godt i gang med koderne
KLIK HER! => http://www.html.dk/tutorials

Thor (11-09-2003)
Kommentar
Fra : Thor


Dato : 11-09-03 12:32

Jeg har prøvet dit forslag, men tabellens højde bliver stadig 21%
af browservinduets højde - ikke bredde. Jeg er vist nødt til at
kaste mig ud i et JavaScript... Du skal dog have tak for
indlægget alligevel. :)

Thomas Dybdahl osv wrote in dk.edb.internet.webdesign.html:
> <snip>
> >
> > <table width="100%" height="?">
> > <tr>
> > <td>xxx<td>
> > </tr>
> > </table>
> >
>
> <table style="width:100%; height:21%;">? Ellers med javascript
>
> --
> Vil du lære at kode HTML, XHTML, CSS, SSI eller ASP?
> - Pædagogiske tutorials på dansk
> - Kom godt i gang med koderne
> KLIK HER! => http://www.html.dk/tutorials


--
Vil du lære at kode HTML, XHTML, CSS, SSI eller ASP?
- Pædagogiske tutorials på dansk
- Kom godt i gang med koderne
KLIK HER! => http://www.html.dk/tutorials

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

Månedens bedste
Årets bedste
Sidste års bedste