Seite 1 von 2
Link für Hintergrundbild - ganze Zelle / Tabelle
Verfasst: 10.04.2007 01:20
von mark2
Wie kann ich dem Hintergrundbild "
head.jpg" in dem Code unten einen Link zur Foren Index zuweisen?
Code: Alles auswählen
<table width="98%" cellspacing="0" border="0" cellpadding="0" align="center">
<tr>
<td class="bodyline" background="templates/DustyGreen/images/head.jpg" valign="top">
<table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td background="templates/DustyGreen/images/forum-new2-top-left.jpg" width="26" height="163">
<div align="center"></div>
</td>
<td height="163" background="templates/DustyGreen/images/forum-new2-top-fill.gif" valign="bottom">
<div align="center"><img src="templates/DustyGreen/images/trans.gif" width="10" height="10"></div>
</td>
<td background="templates/DustyGreen/images/forum-new2-top-center.gif" width="256" height="163">
<div align="center"></div>
</td>
<td height="163" background="templates/DustyGreen/images/forum-new2-top-fill.gif" valign="bottom">
<div align="center"><img src="templates/DustyGreen/images/trans.gif" width="10" height="10"></div>
</td>
<td height="163" background="templates/DustyGreen/images/forum-new2-top-right.jpg" width="26">
<div align="center"></div>
</td>
</tr>
</table>
Verfasst: 10.04.2007 02:22
von silaz
Du kannst keinem hintergrund bild einen Link zuweisen,
eine möglichkeit wäre es ein leeresbild (spacer) über den hintergrundzulegen und diesen Zuverlinken.
Verfasst: 10.04.2007 18:33
von mark2
ok und wie geht das?
Kann man nicht der gesamten Zelle für die das Hintergrundbild gilt einen Link zuweisen. Das Problem ist nur das die <td Anweisung erst weiter unten geschlossen wird
Verfasst: 10.04.2007 18:50
von silaz
Mal abgesehen davon das ich nicht weis wieso du das machen möchtest, hier mal etwas wie es aussehen würde mit spacer.gif (spacer.gif 1x1px großes Tranzparentes gif)
Code: Alles auswählen
<table width="98%" cellspacing="0" border="0" cellpadding="0" align="center">
<tr>
<td class="bodyline" background="templates/DustyGreen/images/head.jpg" valign="top">
<table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td background="templates/DustyGreen/images/forum-new2-top-left.jpg" width="26" height="163">
<div align="center"><a href="http://ww.deinlink.de"><img src="spacer.gif" width="26" height="163"></a></div> </td>
<td height="163" background="templates/DustyGreen/images/forum-new2-top-fill.gif" valign="bottom">
<div align="center"><a href="http://ww.deinlink.de"><img src="templates/DustyGreen/images/trans.gif" width="10" height="10"></a></div> </td>
<td background="templates/DustyGreen/images/forum-new2-top-center.gif" width="256" height="163">
<div align="center"><a href="http://ww.deinlink.de"><a href="http://ww.deinlink.de"><img src="spacer.gif" width="26" height="163"></a></a></div> </td>
<td height="163" background="templates/DustyGreen/images/forum-new2-top-fill.gif" valign="bottom">
<div align="center"><a href="http://ww.deinlink.de"><img src="templates/DustyGreen/images/trans.gif" width="10" height="10"></a></div> </td>
<td height="163" background="templates/DustyGreen/images/forum-new2-top-right.jpg" width="26">
<div align="center"><a href="http://ww.deinlink.de"><a href="http://ww.deinlink.de"><img src="spacer.gif" width="26" height="163"></a></a></div> </td>
</tr>
</table>
Alles in allem macht es keinen sinn ^^
Verfasst: 10.04.2007 19:30
von S2B
Du könntest es auch so versuchen:
Code: Alles auswählen
<a href="index.php" style="display: block; height: <Höhe des Bildes>px; background-image: url(<Bilddatei>)"> </a>
Code: Alles auswählen
a#header_link {
position: absolute;
top: 0;
left: 0;
height: 230px;
width: 100%;
z-index: 2;
text-decoration: none
}
Verfasst: 12.04.2007 19:16
von mark2
Erstmal Danke für die Hilfe.
Aber.
Wieso soll das keinen Sinn machen?
Bei dem code handelt es sich um den Header des Styles DustyGreen.
Jedes Template hat oben links ein Bild das einen Link zur Forenindex hat.
Der Style DustyGreen hat das leider nicht da der Header anders aufgebaut ist. Deswegen möchte ich das gerne nachrüsten.
So sieht der Header original aus.
http://mark2.ma.funpic.de/Bilder/dustygreen_org.jpg
Beim ersten code erhalte ich dieses Ergebnis.
http://mark2.ma.funpic.de/Bilder/dustygreen_ver1.jpg
Und beim zweiten code sieh es so aus.
http://mark2.ma.funpic.de/Bilder/dustygreen_ver2.jpg
Mit dem dritten code komm ich nicht klar. Das kann nicht in die overall_header.tpl gehören. Muß das in die css Datei? Bei dem Style ist css nicht aktiviert
Edit: Große Bilder nur verlinken - Dr.Death
Verfasst: 12.04.2007 19:56
von S2B
mark2 hat geschrieben:Mit dem dritten code komm ich nicht klar. Das kann nicht in die overall_header.tpl gehören. Muß das in die css Datei? Bei dem Style ist css nicht aktiviert
Du kannst die CSS-Eigenschaften auch per style-Attribut setzen:
Code: Alles auswählen
<a href="index.php" style="position: absolute; top: 0; [...]"> </a>
Verfasst: 12.04.2007 21:16
von mark2
Ich habe die Zeile mal einfach an diese Stelle eingebaut. Dadurch ändert sich aber nicht viel. Ich erhalte lediglich ganz oben links einen kleinen Strich der den index Link hat. Von den Bildern im Heat hat keines einen Link bekommen.
Code: Alles auswählen
<table width="98%" cellspacing="0" border="0" cellpadding="0" align="center">
<tr>
<td class="bodyline" background="templates/DustyGreen/images/head.jpg" valign="top">
<a href="index.php" style="position: absolute; top: 0; [...]"> </a>
<table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td background="templates/DustyGreen/images/forum-new2-top-left.jpg" width="26" height="163">
<div align="center"></div>
</td>
<td height="163" background="templates/DustyGreen/images/forum-new2-top-fill.gif" valign="bottom">
<div align="center"><img src="templates/DustyGreen/images/trans.gif" width="10" height="10"></div>
</td>
<td background="templates/DustyGreen/images/forum-new2-top-center.gif" width="256" height="163">
<div align="center"></div>
</td>
<td height="163" background="templates/DustyGreen/images/forum-new2-top-fill.gif" valign="bottom">
<div align="center"><img src="templates/DustyGreen/images/trans.gif" width="10" height="10"></div>
</td>
<td height="163" background="templates/DustyGreen/images/forum-new2-top-right.jpg" width="26">
<div align="center"></div>
</td>
</tr>
</table>
Weiß nicht wie ich das sonst einbauen soll. Was bedeuten eigentlich die drei Punkte in der eckigen Klammer? Ist das ein Platzhalter der durch etwas ergänzt werden muß?
Verfasst: 12.04.2007 21:20
von Dr.Death
Große Bilder bitte nur verlinken.
Bitte lies Dir den
phpBB.de-Knigge sorgfältig durch. Danke.
Solltest Du Dich ungerecht behandelt fühlen, wende Dich bitte an einen der phpBB.de-Administratoren.
Verfasst: 12.04.2007 21:35
von S2B
mark2 hat geschrieben:Weiß nicht wie ich das sonst einbauen soll. Was bedeuten eigentlich die drei Punkte in der eckigen Klammer? Ist das ein Platzhalter der durch etwas ergänzt werden muß?
Jep, das ist ein Platzhalter, der durch den Rest der CSS-Eigenschaften ersetzt werden muss, die bei Fall 3 nötig sind.
