MyBB.de Forum

Normale Version: Zu große Bilder sprengen das Layout
Du siehst gerade eine vereinfachte Darstellung unserer Inhalte. Normale Ansicht mit richtiger Formatierung.
Seiten: 1 2
Hallo MyBB-Community,

Ich habe mein Forum auf eine feste Breite von 980px gesetzt. Alles funktioniert wunderbar, zwar lädt der Browser die "Threadlists" in einer größen Breite, trotz korrekter Pixelangaben, aber wenn fertig geladen worden ist, haben alle Tabellen die korrekte Breite.

Wenn nun jemand ein Bild mit einer Größe von z.B. 1024*x postet, sprengt dieser Post das gesammte Layout, was nicht wirklich schön aussieht.

Hier mal ein Beispiel:

http://forum.4allplayers.org/showthread.php?tid=116

Da Tabellen-Zellen Begrenzungen vom größeren Inhalt generell nicht mehr beachtet werden, gibt es irgendwie ein Möglichkeit das zu beheben (Einstellungen im ACP ? ) ?

Vielen Dank,
Dyers Eve
Nein, eine Einstellung dazu gibt es nicht. Du kannst die Benutzer nur dazu auffordern die Bilder als Attachments zu posten. Irgendwo hier im Forum hab es mal ein Javascript für die Verkleinerung, ich finds aber gerade nicht...
Ich bin nicht 100%ig sicher, ob das geht, aber versuch mal im Beitragsbereich im CSS ein
overflow: auto oder oberflow: scroll, vielleicht löst das das Problem.
Ja, ich habs gefunden Cool

Unter Templates -> Post Bit Templates -> postbit ->

PHP-Code:
<p style="overflow: auto">
{
$post['message']}
</
p

Mit "overflow: hidden" wird das Bild abgetrennt und mit "overflow: scroll" werden bei jedem Beitrag die Scrollbars angezeigt (Der Balken allerdings nur bei den "übergroßen" Beiträgen).

Ist zwar leider keine Verkleinerung, aber ist ebenfalls eine elegante Lösung. Jetzt wird bei den zu groß geratenen Beiträgen am Ende des Post eine waagerechte Scrollbar angezeigt.

Dyers Eve
Der Thread, den Michael oben gemeint hat, ist wohl der hier:

https://www.mybb.de/forum/showthread.php?tid=208

Der ist aber nicht mehr ganz aktuell und ich weiß auch nicht, ob das mit 1.2 klappt.
Da leider der IE 6.0 sowie auf der IE 7.0 den overflow-Befehl nicht unterstützen bzw. das Layout immernoch zerschießen (wen wunderts...).

Möchte ich gerne die ganze Sache mit Javascript lösen!

Dazu habe ich in der Datei class_parser.php im inc-Ordner ab Zeile 626 folgenden Code gefunden:

PHP-Code:
function mycode_parse_img($url$dimensions=array())
    {
        
$url trim($url);
        
$url str_replace("\n"""$url);
        
$url str_replace("\r"""$url);
        if(
$dimensions[0] > && $dimensions[1] > 0)
        {
            return 
"<img src=\"{$url}\" width=\"{$dimensions[0]}\" height=\{$dimensions[1]}\" border=\"0\" alt=\"\" />";
        }
        else
        {
            return 
"<img src=\"{$url}\" border=\"0\" alt=\"\" />";            
        }
    } 

Ehrlich gesagt verstehe ich die erste if-Abfrage nicht wirklich, da nach meinen Beobachtungen die Bedingung niemals erfüllt ist.

Danach habe ich versucht in der else -Schleife die Sache mit "onload" und "onklick" versucht zu lösen, aber das funktioniert leider nicht. Den Javascript Code setzt er mir einfach an das Ende des Bildes, wie eine Zeichenkette.

Hier mein Javascript-Code Versuch den ich hinter alt=\"\" setzen wollte:

onload="javascript:if(this.height > 600) { this.width = 600; }"


Weiss jemand von euch Rat ?

Dyers Eve
Ich hab den oben angesprochenen Thread gefunden: https://www.mybb.de/forum/showthread.php...35#pid4835
Das sollte die schonmal weiterhelfen.
Leider konnte ich den ersten Vorschlag nicht testen, da der Link zur Datei resizeall.js nicht mehr funktioniert. Den 2.Vorschlag habe ich ausprobiert, funktioniert aber leider nicht. Sad

E
Hast du das Ganze schon wieder ausgebaut? Ich kann das Javascript nirgends im Quellcode deines Forums finden.
Ja, nachdem ich den folgenden Code:

onload="javascript:if(this.height > 600) { this.width = 600; }"

in der Datei class_parser.php im inc-Ordner...

return "<img src=\"{$url}\" border=\"0\" alt=\"\"  onload="javascript:if(this.height > 600) { this.width = 600; } "/>";

so eingefügt habe, hat er den Code als String neben das Bild gepackt...(neben jedes Bild auch hinter die Bilder die korrekt sind z.B. Signaturen...)

Das gleiche hiermit:

return "<img src=\"{$url}\" border=\"0\" alt=\"\" onload=\"if(largerThan(this.width,800)) {this.width=800;this.alt='Klicken, um gr&ouml;ßere Version zu sehen';}\" onmouseover=\"if(this.alt) this.style.cursor='pointer';\" onclick=\"if(this.alt) window.open('');\"  />";

Nachdem ich  im "headerinclude" Template das Script eingefügt habe...

EDIT:

Also wenn man im <img> tag den CSS-Befehl style="max-width: 720px" und im Template postbit <p style="overflow: auto"> einfügt, dann funktioniert es perfekt im Firefox und Opera...Der IE kennt den CSS Befehl max-width noch nicht.
Aber ein Anklicken wäre natürlich deutlich besser...

Dyers Eve
Seiten: 1 2