Oprettet i går kl. 21:13

Billeder I en HTML-tabel

Hej

Jeg  lægger mig flad,
Jeg kaster håndklædet ind i ringen.

Jeg har ikke arbejdet aktivt med HTML i snart 10 år (for ikke at sige 15 !), så jeg har faktisk glemt det meste. Og nu har jeg brug for et pr gode råd for at  kunne fuldføre et barnebarns projekt på en ældre windows XP (altså HTML 4).

I en HTML tabel  (16 * 16 celler) skal hver celle (TD-celle) indeholde/ vise et lille image på 125px * 125px. Ved klik på dette iamge skal programmet linke/hoppe videre til en anden local-web-side. Men det at få billeder ind i disse TD-celler kan jeg ikke få til (jeg har glemt hvordan.)  Og hvordan får jeg ved et venstre klik på billede programmet til at hoppe til den valgte local-side (som vil indeholde  yderlige data )  Scriptet som medsendes er yderst tvivlsomt.  (Jeg har en formodning om, at koden er virksom i HTML 5, men ikke i HTML 4).

Altså 2 Problemer:  1: Indsætte billeder og ved klik på disse at hoppe/linke til rette side.

Her er koden:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Image Click Navigation</title>
    <style>
        img {
            cursor: pointer;
            width: 125px;
/*          border: 2px solid #ccc;
            border-radius: 8px;
            transition: transform 0.2s;      */
        }
        img:hover {
    /*      transform: scale(1.05);
            border-color: #666;              */
        }
    </style>
</head>

<body>
  <center>
  <h2>Velkommen til ATMEL DELPHI RESULTAT SIDE</h2>

  <br>
    <Font face="verdana" color="blue" size="3" > Klik et billede for at vise aktuelle data.</font>
  <BR>
  <TABLE cellpadding="0" cellspacing="0"  border="0">
    <tbody>
      <TR height="15px;">
      <td colspan=13" style="background-color: lightblue;"</TD>
      </TR>
      <TR height="125px;">
        <tD width="15px;" Rowspan="5" style="background-color: lightblue;">&nbsp;</td>
        <TD width="125px;"><img src="/DSC_102.jpg"  alt="Sample1" id="clickImage1"></td>
        <tD width="15px;" Rowspan="5" style="background-color: lightblue;">&nbsp;</td>                \v
        <TD width="125px;"><img src=" "/DSC_182.jpg"  alt="Sample2" id="clickImage2"></td>
        <tD width="15px;" Rowspan="5" style="background-color: lightblue;">&nbsp;</td>
        <TD width="125px;">1234</td>
        <tD width="15px;" Rowspan="5" style="background-color: lightblue;">&nbsp;</td>
        <TD width="125px;">1234</td>
        <tD width="15px;" Rowspan="5" style="background-color: lightblue;">&nbsp;</td>
        <TD width="125px;">1234</td>
        <tD width="15px;" Rowspan="5" style="background-color: lightblue;">&nbsp;</td>
        <TD width="125px;">1234</td>
        <tD width="15px;" Rowspan="5" style="background-color: lightblue;">&nbsp;</td>
      </TR>
      <TR height="15px;">
        <td colspan=13" style="background-color: lightblue;"></TD>
      </TR>
      <TR height="125px;">
        <TD width="125px;">1234</td>
        <TD width="125px;">1234</td>
        <TD width="125px;">1234</td>
        <TD width="125px;">1234</td>
        <TD width="125px;">1234</td>
        <TD width="125px;">1234</td>
      </tr>
      <TR height="15px;">
        <td colspan=13" style="background-color: lightblue;"></TD>
      </TR>
      <TR height="125px;">
        <TD width="125px;">1234</td>
        <TD width="125px;">1234</td>
        <TD width="125px;">1234</td>
        <TD width="125px;">1234</td>
        <TD width="125px;">1234</td>
        <TD width="125px;">1234</td>
      </tr>
      <TR height="15px;">
        <td colspan=13" style="background-color: lightblue;"></TD>
      </TR>

  </tbody>
  </Table>
  </center>

<script>
        // Attach click event to image
        document.getElementById("clickImage1").addEventListener("click", function ()
    {
            // Navigate to another local HTML page
            window.location.href = "page2.html";
        }
  );
        // Attach click event to image
        document.getElementById("clickImage2").addEventListener("click", function ()
    {
            // Navigate to another local HTML page
            window.location.href = "page2.html";
        }
  );
</script>

</body>
</html>


For NN := 1 To Uendeli do
    print " Uendelge tak for hjælp ";
END;

(PS: hehe)

Kristian  aka snestrup2016
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
IT-kurser om Microsoft 365, sikkerhed, personlig vækst, udvikling, digital markedsføring, grafisk design, SAP og forretningsanalyse.

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