h4rl3kin: td als verweis?

hallo,

ich find den code irgentwie nich. jetzt wollt ich ma fragen was ich schreiben muss damit bei meiner tabelle die zellen "td" links werden?

also ich mein jetzt sowas:

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

soweit is ja nix besonderes. aba wenn man jetzt mit der maus drüber geht merkt die nich dass es ein link is un bleibt beim normalen zeiger (was für die besucher nich gut is da sie ja nich merken dass es ein link is) (machne besucher zumindest -_-)

mein originalcode sieht so aus: (nur td jetzt)

<td onMouseOver="this.background='http://h4rl3kin.beta.piranho.de/td_bg.gif'" onMouseOut="this.background='http://h4rl3kin.beta.piranho.de/nav_bg.gif'" align="left" height="1" width="148" style="border-bottom:1px solid black"><div style="padding-left:25px; padding-top:3px; padding-bottom:3px;"><a href="" title="">Kontakt</a></div></td>

das funktioniert natürlich als link (aber leider nur der text) jetzt will ich aber ,(wie ich schon erwähnt hab),dass die ganze zeile als link gesehen wird. dabei soll sie aber trotzdem hinterlegt werden wenn man drüber fährt.

ich hoffe ihr versteht mein problem^^.

mfg
h4rl3kin

  1. Hallo,

    <tr>
      <a><td></td></a>

    das geht nicht - a darf kein td enthalten und tr kein a.

    das funktioniert natürlich als link (aber leider nur der text) jetzt will ich aber ,(wie ich schon erwähnt hab),dass die ganze zeile als link gesehen wird. dabei soll sie aber trotzdem hinterlegt werden wenn man drüber fährt.

    du möchtest dem a ein display:block; (und ggf. noch ein width:100%;) verpassen - dann kannst du über a:hover dem Link auch ein Hintergrundbild verpassen.

    Grüße aus Nürnberg
    Tobias

  2. Hallo h4rl3kin,

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

    das geht anders:

    <html>
    <head>
    <title>Zellenlinks</title>
    <meta name="author" content="Gernot Back">
    <meta name="generator" content="Ulli Meybohms HTML EDITOR">
    <style type="text/css">
    <!--
    table {
      width:100%;
      height:100%;
    }

    td {
      width:50%;
      height50%;
    }

    a {
      width:100%;
      height:100%;
      background-color:#ff0000;
      display:block;
    }
    -->
    </style>
    </head>
    <body>
    <table>
    <tr>
     <td><a href="#1"></a></td>
     <td><a href="#2"></a></td>
    </tr>
    <tr>
     <td><a href="#3"></a></td>
     <td><a href="#4"></a></td>
    </tr>
    </table>
    </body>
    </html>

    Gruß Gernot

    1. hallo,

      danke für die antworten, aber meine frage ist damit nicht richtig beantworted (vll habe ich mich auch nur unklar ausgedrückt). ich weis dass <a><td>...  nicht erlaubt ist. was ich wissen wollte: wie kann ich eine zeile zu einem verweis werden lassen, der wenn man mit der maus drüber fährt von einer farbe oder einem bild hinterlegt wird?

      auf "www.tdclan.de" sieht man sehr gut was ich meine wenn man über die verweise auf der linken seite fährt (Home/News, Members.......)
      dann ist die komplette zelle "td" ein link und dieser link ist hellblau hinterlegt. genau das würde ich gern wissen, bloß dass ich anstatt des hellblaus gerne ein bild hinterlegen will. nicht mehr.

      mfg h4rl3kin.

      1. Hallo h4rl3kin

        ... wie kann ich eine zeile zu einem verweis werden lassen, der wenn man mit der maus drüber fährt von einer farbe oder einem bild hinterlegt wird?

        Wozu willst du das?
        Warum reicht es dir nicht, wenn der Link (<a href="...) die Tabellenzelle
        vollständig ausfüllt?

        Dann ist doch praktisch die gesamte Tabellenzelle der Link!

        Auf Wiederlesen
        Detlef

        --
        - Wissen ist gut
        - Können ist besser
        - aber das Beste und Interessanteste ist der Weg dahin!
        1. Hallo Detlef,

          ... wie kann ich eine zeile zu einem verweis werden lassen, der wenn man mit der maus drüber fährt von einer farbe oder einem bild hinterlegt wird?

          Wozu willst du das?
          Warum reicht es dir nicht, wenn der Link (<a href="...) die Tabellenzelle
          vollständig ausfüllt?

          Na das kann schon praktisch sein, ganze Zellen mit einem durch JS imitierten Hovereffekt zu hinterlegen. Mit anderen Brosern als dem IE geht das ja wirklich auch nur mit CSS. Dadurch behält man bei sehr inhaltsdichten Tabellen den Überblick, in welcher zeile man sich gerade befindet und muss nicht mit dem Finger (Touchscreen-Methode) nachhelfen.

          Gruß Gernot

          1. Hallo Gernot

            Na das kann schon praktisch sein, ganze Zellen ...
            Überblick, in welcher zeile man sich gerade befindet ...

            Meinst du Zellen oder Zeilen?

            Wenn ich nicht verkehrt gelesen habe ging es bisher um Tabellenzellen, die
            Links sein sollten, wofür die Ausdehnung des Verweises auf die gesamte
            Tabellenzelle wohl die beste Lösung sein dürfte.

            Auf Wiederlesen
            Detlef

            --
            - Wissen ist gut
            - Können ist besser
            - aber das Beste und Interessanteste ist der Weg dahin!
            1. Hallo Detlef,

              Meinst du Zellen oder Zeilen?

              Dem OP ging es wohl um Zeilen, auch wenn er den Titel des Threads unglücklich gewählt hat, wie er selbst einräumt.

              https://forum.selfhtml.org/?t=97474&m=593358

              Und Tobias hat mit seinem Einwand auch recht, dass man dabei gar nicht über die ID der Zeile gehen muss.

              https://forum.selfhtml.org/?t=97474&m=593378

              Gruß Gernot

      2. Hallo h4rl3kin,

        danke für die antworten, aber meine frage ist damit nicht richtig beantworted (vll habe ich mich auch nur unklar ausgedrückt). ich weis dass <a><td>...  nicht erlaubt ist. was ich wissen wollte: wie kann ich eine zeile zu einem verweis werden lassen, der wenn man mit der maus drüber fährt von einer farbe oder einem bild hinterlegt wird?

        Das kannst du gar nicht mit CSS machen, sondern nur mit JS (onMouseOver und onMouseOut)

        Hier die HTML-, JS- und CSS-Codefragmente:

        <tr onMouseOver="rein(this)" onMouseOut="raus(this)" id="deineZeilenId">
         <td>erste zelle<td>
         <td>zweite zelle</td>
        </tr>

        function rein (x) {
         if (document.getElementById){
           document.getElementById(x.id).style.backgroundColor='#FF0000';
         }
        }

        function raus (x) {
         if (document.getElementById){
           document.getElementById(x.id).style.backgroundColor='#000000';
         }
        }

        tr {
          background-color:#000000;
        }

        Gruß Gernot

        1. Hallo Gernot,

          danke für die antworten, aber meine frage ist damit nicht richtig beantworted (vll habe ich mich auch nur unklar ausgedrückt). ich weis dass <a><td>...  nicht erlaubt ist. was ich wissen wollte: wie kann ich eine zeile zu einem verweis werden lassen, der wenn man mit der maus drüber fährt von einer farbe oder einem bild hinterlegt wird?
          Das kannst du gar nicht mit CSS machen, sondern nur mit JS (onMouseOver und onMouseOut)

          Da erhebt sich jetzt die Frage ob der OP eine Zeile (<tr>) oder eine Zelle (<td>) meint - in https://forum.selfhtml.org/?t=97474&m=593358 ist zwar von Zeile die Rede, aber ich vermute mal er meint doch eher Zelle wie in https://forum.selfhtml.org/?t=97474&m=593337.

          <tr onMouseOver="rein(this)" onMouseOut="raus(this)" id="deineZeilenId">

          das geht natürlich auch mit
            tr       { background-color:#000; }
            tr:hover { background-color:#F00; }

          • dass der IE das nicht kann, brauche ich nicht erwähnen, oder...?

          document.getElementById(x.id).style.backgroundColor='#FF0000';

          das getElementById ist hier überflüssig, es reicht ein
            x.style.backgroundColor = '#F00';
          da man mit x bereits eine Referenz (oder wie das auch immer heißt) auf das Element enthält.

          Grüße aus Nürnberg
          Tobias

      3. Hallo,

        auf "www.tdclan.de" sieht man sehr gut was ich meine wenn man über die verweise auf der linken seite fährt (Home/News, Members.......)
        dann ist die komplette zelle "td" ein link und dieser link ist hellblau hinterlegt.

        nein, ist es nicht (zumindest in standardkonformen Browsern wie Firefox, Opera orientiert sich hier leider zu sehr am IE). Auf der Seite hat der Autor versucht den Link mit width:110; auf die Breite der Tabellenspalte zu bringen, da aber 1. die Einheit fehlt und 2. inline-Elemente wie a keine Breite haben (bzw. so breit sind wie ihr Inhalt), kann das so nicht funktionieren.

        genau das würde ich gern wissen, bloß dass ich anstatt des hellblaus gerne ein bild hinterlegen will. nicht mehr.

        hast du die Antworten eigentlich gelesen? Hast du es schonmal mit »a { display:block; }« versucht? Auf http://www.fh-nuernberg.de/wt/ habe ich auch mit display:block; gearbeitet (die Navigation ist zwar eine Liste, aber bei Tabellen geht das genauso). In der CSS-Datei kannst du statt text-decoration auf underline zu setzen (Zeile 33) natürlich auch ein Bild hinterlegen (mit http://de.selfhtml.org/css/eigenschaften/hintergrund.htm#background_image@title=background-image).

        Grüße aus Nürnberg
        Tobias

      4. auf "www.tdclan.de" sieht man sehr gut was ich meine wenn man über die verweise auf der linken seite fährt (Home/News, Members.......)

        Nein, sieht man nicht (zumindet im Firefox nicht)

        dann ist die komplette zelle "td" ein link und dieser link ist hellblau hinterlegt. genau das würde ich gern wissen, bloß dass ich anstatt des hellblaus gerne ein bild hinterlegen will. nicht mehr.

        Schau dir mal die Seite an: http://css.maxdesign.com.au/listamatic/
        lauter hover Effekte ohne JS und ohne Tabellen und die meisten funktionieren sogar im IE.

        Struppi.