Hallo, Gast! (Registrieren)

Wir wünschen allen Besuchern frohe Ostern!

Letzte Ankündigung: MyBB 1.8.22 veröffentlicht (31.12.19)


Benutzer, die gerade dieses Thema anschauen: 1 Gast/Gäste
Klickbare Vorschau von Bildern bei Anhängen
#1
Wenn Bilder an einen Beitrag angehangen werden, sollen sie als verkleinerte Vorschau dargestellt werden und klickbar sein.

Die Verkleinerung funktioniert wunderbar, da ich an das Fieldset des Templates postbit_attachments folgende Klasse angehangen habe, sowie das Image in postbit_attachments_images_image die zweite Klasse, und folgenden Code in der CSS:

Code:
fieldset.attachedimg img.attachment {
width: 150px;
}

Nun zu meinem Problem, wenn ich im Template postbit_attachments_images_image den Code von

Code:
<img class="attachment" src="attachment.php?aid={$attachment['aid']}" title="{$attachdate}" />

zu

Code:
<a href="attachment.php?aid={$attachment['aid']}"><img class="attachment" src="attachment.php?aid={$attachment['aid']}" title="{$attachdate}" /></a>

ändere...

...dann ändert sich das auch für alle in den Beiträgen eingefügten Anhängen.

Verlinkt dort jemand ein Bild mittels BB-Code, dann sieht der Code so aus:

Code:
<a href="WebseitenURL"></a>
  <a href="AttachmentURL">
    <img src="AttachmentURL" />
  </a>

Statt so:

Code:
<a href="WebseitenURL">
  <a href="AttachmentURL">
    <img src="AttachmentURL" />
  </a>
</a>

Das ist problematisch, weil Nutzer die Bilder mit Webseiten verlinken, aber stattdessen das Bild geladen wird.

Ich nehme an, es gibt kein extra Template für die Images im Anhang-Fieldset.

Fällt jemanden hierfür ein Workaround ein, um die angehangten Bilder mit sich selbst zu verlinken, wenn sie nicht in den Beitrag eingefügt sind? (Und wenn sie in den Beitrag eingefügt sind, dann nicht.)
Habe es wie folgt per CSS gelöst:

HTML-Code im postbit_attachments_images_image Template

Code:
<img class="clickoff attachment" src="attachment.php?aid={$attachment['aid']}" title="{$attachdate}" />
<div class="clickon"><a href="attachment.php?aid={$attachment['aid']}"><img class="attachment" src="attachment.php?aid={$attachment['aid']}" title="{$attachdate}" /></a></div>

CSS-Code:

Code:
fieldset.attachedimg img.attachment {
    width: 150px;
}
.clickon {
    display: none;
}
.clickoff {
    display: inline-block;
}
fieldset.attachedimg .clickon {
    display: inline-block;
}
fieldset.attachedimg .clickoff {
    display: none;
}

Bei meiner Variante muss noch die Klasse zum Fieldset des Postbits hinzugefügt werden:

Code:
<fieldset class="attachedimg">

Template: postbit_attachments

Tada, angehängte Bilder, die nicht in den Beitrag eingefügt werden, sind als verkleinerte Vorschau klickbar.

Hoffe, das hilft jemanden, der das auch möchte.

@Moderation: Würde den Titel noch umbenennen in "Klickbare Vorschau von Bildern bei Anhängen"
Zitieren


Möglicherweise verwandte Themen…
Thema Verfasser Antworten Ansichten Letzter Beitrag
  Relativer Pfad zu Bildern in Postings Shanee 25 2.684 15.10.2012, 05:55
Letzter Beitrag: MrBrechreiz
  [Problem] Pfad zu den Bildern? Buma 7 1.393 03.10.2009, 21:51
Letzter Beitrag: linwinman
  Mehrere klickbare Logos im Header? atmospheric railway 4 1.290 27.09.2009, 17:01
Letzter Beitrag: atmospheric railway
  Zusammenhang von Templates, Themes UND Bildern helpy 3 1.048 16.03.2007, 16:00
Letzter Beitrag: StefanT