Søg
Avatar billede matz Nybegynder
11. juli 2003 - 00:46 Der er 12 kommentarer og
1 løsning

Hjælp til at Tabel !

Jeg skal have sæt en tabel ind på det hvide, som i kan se på billedet. Hvordan gøres det ?

http://matz.users.whitehat.dk/ny/design.html
Avatar billede roenving Novice
11. juli 2003 - 01:03 #1
Sætter en absolut positioneret div ind, med din tabel inden i -- og så skal den flyttes med skærmstørrelse m.m.
Avatar billede matz Nybegynder
11. juli 2003 - 01:04 #2
Hmm hvordan gøres det med div ?
Avatar billede roenving Novice
11. juli 2003 - 01:25 #3
Det er jo et stort billede med et lysnet felt, ikke ?-)

Så kan det ikke gøres på andre måder:

<div id="tableDiv" style="position:absolute;height:150px;width:150px;">
<table width="100%"><tr><td>
Hele din tabel her</td>
</tr>
</table>
</div>

Størrelsen sættes selvfølgelig, så det matcher dit lyse felt ...

Så skal du give den celle, som div'en skal ligge indeni et id:

<td id="divCelle" width="705" background="1.jpg" bgcolor="#CCCCCC" valign="top">

<script language="javascript" type="text/javascript">
function setPos(elm,div) {
    for(var zx=zy=0;elm!=null;zx+=elm.offsetLeft,zy+=elm.offsetTop,elm=elm.offsetParent);
    div.style.top=zy+75;
    div.style.left=zx+75;
}
</script>

<BODY ONRESIZE="setPos(document.getElementById('divCelle'),document.getElementById('tableDiv');" ONLOAD="setPos(document.getElementById('divCelle'),document.getElementById('tableDiv');">

-- ganske utestet, men den skulle kunne køre, måske med nogle småfejl ...

Bemærk TO steder skal der sættes størrelse på -- udover i div'en, skal der også sættes korrekt offset i javascript-funktionen !-)
Avatar billede matz Nybegynder
11. juli 2003 - 13:02 #4
Hmm, kan du ik lige sætte det ind i den her kode :)

<html>

<head>

<title>CoolOrNot.dk</title>

<base target="main">

<style type="text/css">
<!--
BODY {
SCROLLBAR-FACE-COLOR: #E6E6E6; SCROLLBAR-HIGHLIGHT-COLOR: #000000; SCROLLBAR-SHADOW-COLOR: #000000; SCROLLBAR-3DLIGHT-COLOR: #e6e6e6; SCROLLBAR-ARROW-COLOR: #000000; SCROLLBAR-TRACK-COLOR: #E6E6E6; SCROLLBAR-DARKSHADOW-COLOR: #E6E6E6;
}

-->
</style>
<link rel="stylesheet" type="text/css" href="bat.css">
</head>

<body bgcolor="#FFFFFF">
<center>

<table border="0" bgcolor="#FFFFFF" cellspacing="0" cellpadding="0">
<tr>
<td>
<img src="top3.jpg">
</td>
</tr>

<tr>
<td>

<center>
<table width="705" height="30" cellspacing="0" cellpadding="0">
<tr>
<td width="705" background="menubar.jpg" align="center" height="30" valign="middle">


<a href="link.html">Link </a>
|
<a href="link2.html">Link2 </a>
|
<a href="link3.html">Link3 </a>
|
<a href="link4.html">Link4 </a>
|
<a href="link5.html">Link5 </a>
|
<a href="link6.html">Link6 </a>


</td>
</tr>

</table>
</center>

</td>
</tr>

<tr>
<td bgcolor="FFFFFF">

<center>

<table width="705" height="350" cellspacing="0" cellpadding="2">
<tr>
<td width="705" background="1.jpg" bgcolor="#CCCCCC" valign="top">

</td>
</tr>
</table>

</center>

</td>
</tr>

<tr>
<td>
<img src="bund3.jpg">
</td>
</tr>





</table>
</center>
</body>
</html>
Avatar billede roenving Novice
11. juli 2003 - 13:29 #5
Sådan, men de præcise positioneringer kunne jeg jo ikke lave uden billedet -- det kan du vel også selv prøve lidt med ...
I scriptet er offset til tabelhjørnet sat til 75px fra side og top, prøv lidt indtil du fanger den præcis ...
Størrelsen på tabellen er sat til 150*150px -- den skal du også lige få til at passe !-)

<html>
<head>
<title>CoolOrNot.dk</title>
<base target="main">
<script language="javascript" type="text/javascript">
function setPos(elm,div) {
//alert(elm.id+" "+div.id);
    for(var zx=zy=0;elm!=null;zx+=elm.offsetLeft,zy+=elm.offsetTop,elm=elm.offsetParent);
    div.style.top=zy+75;
    div.style.left=zx+75;
}
</script>
<style type="text/css">
BODY {
SCROLLBAR-FACE-COLOR: #E6E6E6; SCROLLBAR-HIGHLIGHT-COLOR: #000000; SCROLLBAR-SHADOW-COLOR: #000000; SCROLLBAR-3DLIGHT-COLOR: #e6e6e6; SCROLLBAR-ARROW-COLOR: #000000; SCROLLBAR-TRACK-COLOR: #E6E6E6; SCROLLBAR-DARKSHADOW-COLOR: #E6E6E6;
}
</style>
<link rel="stylesheet" type="text/css" href="bat.css">
</head>
<body bgcolor="#FFFFFF"ONRESIZE="setPos(document.getElementById('divCelle'),document.getElementById('tableDiv'));" ONLOAD="setPos(document.getElementById('divCelle'),document.getElementById('tableDiv'));">
<center>
<table border="0" bgcolor="#FFFFFF" cellspacing="0" cellpadding="0">
<tr>
<td>
<img src="top3.jpg">
</td>
</tr>
<tr>
<td>
<center>
<table width="705" height="30" cellspacing="0" cellpadding="0">
<tr>
<td width="705" background="menubar.jpg" align="center" height="30" valign="middle">
<a href="link.html">Link </a>
|
<a href="link2.html">Link2 </a>
|
<a href="link3.html">Link3 </a>
|
<a href="link4.html">Link4 </a>
|
<a href="link5.html">Link5 </a>
|
<a href="link6.html">Link6 </a>
</td>
</tr>
</table>
</center>
</td>
</tr>
<tr>
<td bgcolor="FFFFFF">
<center>
<table width="705" height="350" cellspacing="0" cellpadding="2">
<tr>
<td id="divCelle" width="705" background="1.jpg" bgcolor="#CCCCCC" valign="top">
<div id="tableDiv" style="position:absolute;height:150px;width:150px;">
<table border="1" style="width:150px;height:150px"><tr><td>
Hele din tabel her</td>
</tr>
</table>
</div>
</td>
</tr>
</table>
</center>
</td>
</tr>
<tr>
<td>
<img src="bund3.jpg">
</td>
</tr>
</table>
</center>
</body>
</html>

hth
jes
Avatar billede matz Nybegynder
11. juli 2003 - 15:02 #6
Nu har jeg leget lidt med Højde & bredde, men kan man ik få teksten til at starte øverst oppe som normalt, og ikke i midten ? Og hvordan for jeg tabellen længere op ? :)
Avatar billede matz Nybegynder
11. juli 2003 - 15:04 #7
Prøv at se her hvad jeg har gjort indtil videre: http://matz.users.whitehat.dk/ny/design.html
Avatar billede matz Nybegynder
11. juli 2003 - 15:28 #8
Ok, jeg fandt ud af det med højde & Bredde.

Men hvordan får jeg teksten til at starte oppe fra venstre ?
Avatar billede roenving Novice
11. juli 2003 - 15:31 #9
Det skulle kunne virke med
<table valign="top" style="width:325px;height:254px"><tr><td>
Avatar billede matz Nybegynder
11. juli 2003 - 15:36 #10
Det virker desværre ikke.. Kig selv efter: http://matz.users.whitehat.dk/ny/design.html
Avatar billede roenving Novice
11. juli 2003 - 15:50 #11
Sådan:
<table style="width:325px;height:254px"><tr valign="top"><td>

'-)
Avatar billede matz Nybegynder
11. juli 2003 - 15:53 #12
Jeps det virker, tak for hjælpen :)
Avatar billede roenving Novice
11. juli 2003 - 15:57 #13
Velbekomme -- og tak for points ;~}
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
Webudvikling kurser
Vi tilbyder markedets bedste kurser inden for webudvikling
Se alle Webudvikling kurser

Flere spørgsmål fra HTML kategorien

Titel Indlæg Oprettet Seneste aktivitet
Hjælp med HTML og CSS Af Nojsa i HTML 18 10/09/202515:07 17/09/202515:11
CSS 2 x firkanter + tekst på samme linje Af nemlig i HTML 3 19/03/202522:16 20/03/202513:04
Se og ændre html på en webside Af magger i HTML 4 11/03/202513:55 12/03/202506:56
Få input felt, der er med fed skrift og formatteres på linje Af KurtG i HTML 5 02/03/202520:05 04/03/202515:40
Variabler som ikke virker Af Frits Jensen i HTML 3 30/10/202409:37 01/01/202515:27
Se alle spørgsmål i kategorien Opret spørgsmål

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.

Opret Log ind

Du kan også logge ind via nedenstående tjenester

Alle kategorier på Eksperten
Seneste spørgsmål Seneste aktivitet
I dag 15:34 Installer alarmlyd på Samsung Galaxy XCover 7 Pro Af ErikHg i Mobiltelefoner
08/0913:06 Kan ikke starte min pc Af Malm i PC
07/0919:20 DVD program Af dcedata1977 i Andet software
07/0916:09 Bitdefender brokker sig Af FinnRasmussen i Andet sikkerhed
06/0921:00 Libre Office Impress Af Frank i Andre styresystemer
White papers
Flere white papers »