Symbol-Bar / Smilies werden im Gästebuch fehlerhaft angezeigt

06.08.2009 11:53 (zuletzt bearbeitet: 06.08.2009 11:54)
avatar  SJS.666
#1 Symbol-Bar / Smilies werden im Gästebuch fehlerhaft angezeigt
SJ
Mitglied

Ich habe die Symbol-Bar im Bereich des Auswahl-Fensters für Smilies etwas individueller gestaltet. Das funktioniert auch alles super. Leider nicht im Bereich Profil/Gästebuch. Dort wird die Auswahl der Smilies nicht korrekt im definierten Auswahl-Fenster dargestellt, sondern ohne Zeilenumbruch in einer Reihe ohne die Begrenzung (width) des Fensters zu beachten.

Hier mal der Code meines Auswahl-Fensters, wobei ich nicht an einen Fehler im Code glaube, denn außer im Bereich Gästebuch funktioniert dieser ja einwandfrei!

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
<div class="iconbar" style="position: relative; display: inline;">

<div class="iconbar_main" style="display: inline;">
<A HREF="javascript:insert('[b]','[/b]')" title="Fett"><img src="https://img.homepagemodules.de/ds/static/gaia/bold.png" alt="[b] Text [/b]" border=0></A>
<A HREF="javascript:insert('[i]','[/i]')" title="Kursiv"><img src="https://img.homepagemodules.de/ds/static/gaia/italic.png" alt="[i] Text [/i]" border=0></A>
<A HREF="javascript:insert('[u]','[/u]')" title="Unterstrichen"><img src="https://img.homepagemodules.de/ds/static/gaia/underline.png" alt="[u] Text [/u]" border=0 ></A>
<A HREF="javascript:insert('[quote]','[/quote]')" title="Zitat einfügen"><img src="https://img.homepagemodules.de/ds/static/gaia/quote.png" alt="[quote] Text [/quote]" border=0></A>
<A HREF="javascript:insert('[URL]','[/URL]')" title="Link einfügen"><img src="https://img.homepagemodules.de/ds/static/gaia/link.png" alt="[URL]http://[/URL]" border=0></A>
<A HREF="javascript:insert('[img]','[/img]')" title="Bild einfügen"><img src="https://img.homepagemodules.de/ds/static/gaia/picture.png" alt="[img]http://[/img]" border=0></A>
<img src="https://img.homepagemodules.de/ds/static/gaia/smile.png" alt="[smile]" border=0 onclick="document.getElementById('tab_color').style.display='none'; if (document.getElementById('tab_smilies').style.display == 'block') {document.getElementById('tab_smilies').style.display='none'; } else {document.getElementById('tab_smilies').style.display='block';}" onmouseover="this.style.cursor='pointer';" title="Smilies einfügen">
<img src="https://img.homepagemodules.de/ds/static/gaia/color3.png" alt="[smile]" border=0 onclick="document.getElementById('tab_smilies').style.display='none'; if (document.getElementById('tab_color').style.display == 'block') {document.getElementById('tab_color').style.display='none'; } else {document.getElementById('tab_color').style.display='block';}" onmouseover="this.style.cursor='pointer';" title="Farben einfügen">
<A HREF="javascript:insert('[MAIL]','[/MAIL]')"><img src="https://img.homepagemodules.de/ds/static/gaia/mail.png" alt="[MAIL] E-Mail [/MAIL]" border="0" title="E-Mail Adresse einfügen"></A>
<A HREF="javascript:insert('[code]','[/code]')"><img src="https://img.homepagemodules.de/ds/static/gaia/code.png" alt="[code] Code [/code]" border=0 title ="Code einfügen"></A>
</div>

<div id="tab_smilies" style="display: none; position: absolute; background-color: white; top: -206px; padding: 5px; width: 319px; left: -84px;" onlick="document.getElementById('tab_smilies').style.display='none';">
<center>
<A HREF="javascript:returnTag('[smile]')"><img src="https://img.homepagemodules.de/smile.gif" alt="[smile]" border=0 width="15" height="15"></A>
<A HREF="javascript:returnTag('[rose]')"><img src="https://img.homepagemodules.de/rose.gif" alt="[rose]" border=0 width="15" height="15"></A>
<A HREF="javascript:returnTag('[clown]')"><img src="https://img.homepagemodules.de/clown.gif" alt="[clown]" border=0 width="15" height="15"></A>
<A HREF="javascript:returnTag('[devil]')"><img src="https://img.homepagemodules.de/devil.gif" alt="[devil]" border=0 width="15" height="15"></A>
<A HREF="javascript:returnTag('[death]')"><img src="https://img.homepagemodules.de/death.gif" alt="[death]" border=0 width="15" height="15"></A>
<A HREF="javascript:returnTag('[flash]')"><img src="https://img.homepagemodules.de/flash.gif" alt="[flash]" border=0 width="15" height="15"></A>
<A HREF="javascript:returnTag('[sick]')"><img src="https://img.homepagemodules.de/sick.gif" alt="[sick]" border=0 width="15" height="15"></A>
<A HREF="javascript:returnTag('[heart]')"><img src="https://img.homepagemodules.de/heart.gif" alt="[heart]" border=0 width="15" height="15"></A>
<A HREF="javascript:returnTag('[idee]')"><img src="https://img.homepagemodules.de/idee.gif" alt="[idee]" border=0 width="15" height="15"></A>
<A HREF="javascript:returnTag('[blush]')"><img src="https://img.homepagemodules.de/blush.gif" alt="[blush]" border=0 width="15" height="15"></A>
<A HREF="javascript:returnTag('[mad]')"><img src="https://img.homepagemodules.de/mad.gif" alt="[mad]" border=0 width="15" height="15"></A>
<A HREF="javascript:returnTag('[sad]')"><img src="https://img.homepagemodules.de/sad.gif" alt="[sad]" border=0 width="15" height="15"></A>
<A HREF="javascript:returnTag('[shocked]')"><img src="https://img.homepagemodules.de/shocked.gif" alt="[shocked]" border=0 width="15" height="15"></A>
<A HREF="javascript:returnTag('[wink]')"><img src="https://img.homepagemodules.de/wink.gif" alt="[wink]" border=0 width="15" height="15"></A>
<A HREF="javascript:returnTag('[frown]')"><img src="https://img.homepagemodules.de/frown.gif" alt="[frown]" border=0 width="15" height="15"></A>
<A HREF="javascript:returnTag('[crazy]')"><img src="https://img.homepagemodules.de/crazy.gif" alt="[crazy]" border=0 width="15" height="15"></A>
<A HREF="javascript:returnTag('[smile2]')"><img src="https://img.homepagemodules.de/smile2.gif" alt="[smile2]" border=0 width="15" height="15"></A>
<A HREF="javascript:returnTag('[grin]')"><img src="https://img.homepagemodules.de/grin.gif" alt="[grin]" border=0 width="15" height="15"></A>
<A HREF="javascript:returnTag('[laugh]')"><img src="https://img.homepagemodules.de/laugh.gif" alt="[laugh]" border=0 width="15" height="15"></A>
<A HREF="javascript:returnTag('[oh]')"><img src="https://img.homepagemodules.de/oh.gif" alt="[oh]" border=0 width="15" height="15"></A>
<A HREF="javascript:returnTag('[rolling_eyes]')"><img src="https://img.homepagemodules.de/rolling_eyes.gif" alt="[rolling_eyes]" border=0 width="15" height="15"></A>
<A HREF="javascript:returnTag('[lil]')"><img src="https://img.homepagemodules.de/lil.gif" alt="[lil]" border=0 width="15" height="16"></A>
<A HREF="javascript:returnTag('[cool]')"><img src="https://img.homepagemodules.de/cool.gif" alt="[cool]" border=0 width="15" height="15"></A>
<A HREF="javascript:returnTag('[fragezeichen]')"><img src="https://files.homepagemodules.de/b93334/a_62.gif" alt="[fragezeichen] border=0 width="25" height="24"></A>
<A HREF="javascript:returnTag('[applaus]')"><img src="https://files.homepagemodules.de/b93334/a_56.gif" alt="[applaus] border=0 width="31" height="23"></A>
<A HREF="javascript:returnTag('[diener]')"><img src="https://files.homepagemodules.de/b93334/a_61.gif" alt="[diener]" border=0 width="27" height="22"></A>
<A HREF="javascript:returnTag('[kloppen]')"><img src="https://files.homepagemodules.de/b93334/a_64.gif" alt="[kloppen]" border=0 width="33" height="26"></A>
<A HREF="javascript:returnTag('[stinkefinger]')"><img src="https://files.homepagemodules.de/b93334/a_75.gif" alt="[stinkefinger]" border=0 width="37" height="15"></A>
<A HREF="javascript:returnTag('[top]')"><img src="https://files.homepagemodules.de/b93334/a_76.gif" alt="[top]" border=0 width="25" height="18"></A>
<A HREF="javascript:returnTag('[zunge raus]')"><img src="https://files.homepagemodules.de/b93334/a_77.gif" alt="[zunge raus]" border=0 width="33" height="19"></A>
<A HREF="javascript:returnTag('[knuddel]')"><img src="https://files.homepagemodules.de/b93334/a_65.gif" alt="[knuddel]" border=0 width="45" height="30"></A>
<A HREF="javascript:returnTag('[pfeifen]')"><img src="https://files.homepagemodules.de/b93334/a_70.gif" alt="[pfeifen]" border=0 width="33" height="15"></A>
<A HREF="javascript:returnTag('[nudelholz]')"><img src="https://files.homepagemodules.de/b93334/a_68.gif" alt="[nudelholz]" border=0 width="26" height="22"></A>
<A HREF="javascript:returnTag('[lol]')"><img src="https://files.homepagemodules.de/b93334/a_66.gif" alt="[lol]" border=0 width="29" height="27"></A>
<A HREF="javascript:returnTag('[respekt]')"><img src="https://files.homepagemodules.de/b93334/a_72.gif" alt="[respekt] border=0 width="43" height="18"></A>
<A HREF="javascript:returnTag('[smoking]')"><img src="https://files.homepagemodules.de/b93334/a_73.gif" alt="[smoking]" border=0 width="24" height="23"></A>
<A HREF="javascript:returnTag('[essen]')"><img src="https://files.homepagemodules.de/b93334/a_87.gif" alt="[essen]" border=0 width="30" height="25"></A>
<A HREF="javascript:returnTag('[popcorn]')"><img src="https://files.homepagemodules.de/b93334/a_71.gif" alt="[popcorn]" border=0 width="35" height="35"></A>
<A HREF="javascript:returnTag('[cafe]')"><img src="https://files.homepagemodules.de/b93334/a_59.gif" alt="[cafe]" border=0 width="35" height="31"></A>
<A HREF="javascript:returnTag('[oioioi]')"><img src="https://files.homepagemodules.de/b93334/a_69.gif" alt="[oioioi]" border=0 width="46" height="32"></A>
<A HREF="javascript:returnTag('[dance]')"><img src="https://files.homepagemodules.de/b93334/a_60.gif" alt="[dance]" border=0 width="30" height="24"></A>
<A HREF="javascript:returnTag('[10 punkte]')"><img src="https://files.homepagemodules.de/b93334/a_55.gif" alt="[10 punkte]" border=0 width="60" height="35"></A>
<A HREF="javascript:returnTag('[arsch]')"><img src="https://files.homepagemodules.de/b93334/a_57.gif" alt="[arsch]" border=0 width="47" height="28"></A>
<A HREF="javascript:returnTag('[bier]')"><img src="https://files.homepagemodules.de/b93334/a_58.gif" alt="{bier]" border=0 width="50" height="50"></A>
<A HREF="javascript:returnTag('[gute nacht]')"><img src="https://files.homepagemodules.de/b93334/a_63.gif" alt="[gute nacht]" border=0 width="57" height="43"></A>
<A HREF="javascript:returnTag('[spam]')"><img src="https://files.homepagemodules.de/b93334/a_74.gif" alt="[spam]" border=0 width="41" height="46"></A>
<A HREF="javascript:returnTag('[no spam]')"><img src="https://files.homepagemodules.de/b93334/a_67.gif" alt="[no spam]" border=0 width="64" height="46"></A>
<A HREF="javascript:returnTag('[ausgezeichnet]')"><img src="https://files.homepagemodules.de/b93334/a_78.gif" alt="[ausgezeichnet]" border=0 width="60" height="60"></A>
</center>
</div>

<div id="tab_color" style="display: none; position: absolute; background-color: white; top: -48px; padding: 5px; width: 110px; left: 125px;">
<center>
<A HREF="javascript:insert('[rot]','[/rot]')" onclick="document.getElementById('tab_color').style.display='none';"><img src="https://img.homepagemodules.de/rot.gif" alt="[rot] Text [/rot]" border=0 width="10" height="18"></A>
<A HREF="javascript:insert('[style=color:#ffff00;]','[/style]')" onclick="document.getElementById('tab_color').style.display='none';"><img src="https://files.homepagemodules.de/b93334/a_86.gif" alt="[gelb]" border=0 width="10" height="18"></A>
<A HREF="javascript:insert('[blau]','[/blau]')" onclick="document.getElementById('tab_color').style.display='none';"><img src="https://img.homepagemodules.de/blau.gif" alt="[blau] Text [/blau]" border=0 width="10" height="18"></A>
<A HREF="javascript:insert('[gruen]','[/gruen]')" onclick="document.getElementById('tab_color').style.display='none';"><img src="https://img.homepagemodules.de/gruen.gif" alt="[gruen] Text [/gruen]" border=0 width="10" height="18"></A>
<A HREF="javascript:insert('[orange]','[/orange]')" onclick="document.getElementById('tab_color').style.display='none';"><img src="https://img.homepagemodules.de/orange.gif" alt="[orange] Text [/orange]" border=0 width="10" height="18"></A>
<A HREF="javascript:insert('[lila]','[/lila]')" onclick="document.getElementById('tab_color').style.display='none';"><img src="https://img.homepagemodules.de/lila.gif" alt="[lila] Text [/lila]" border=0 width="10" height="18"></A>
<A HREF="javascript:insert('[weiss]','[/weiss]')" onclick="document.getElementById('tab_color').style.display='none';"><img src="https://img.homepagemodules.de/weiss.gif" alt="[weiss] Text [/weiss]" border=0 width="10" height="18"></A>
<A HREF="javascript:insert('[schwarz]','[/schwarz]')" onclick="document.getElementById('tab_color').style.display='none';"><img src="https://img.homepagemodules.de/schwarz.gif" alt="[schwarz] Text [/schwarz]" border=0 width="10" height="18"></A>
</center>
</div>

</div>


Ich hänge mal ein paar Screenshots an. Der erste zeigt das Auswahl-Fenster der Smilies in allen Bereichen, wie es aussehen soll, die anderen beiden zeigen das fehlerhafte Auswahl-Fenster im Gästebuch.

Testforum - aktuell Standard-Template - Boardnummer: 93334
Kurvenjäger - Boardnummer: 210067


 Antworten

 Beitrag melden
06.08.2009 12:25
avatar  SJS.666
#2 RE: Symbol-Bar / Smilies werden im Gästebuch fehlerhaft angezeigt
SJ
Mitglied

Ich denke ich kann den Fehler weiter eingrenzen.
Es scheint so als wenn im Bereich Gästebuch im Auswahl-Fenster der Smilies der Zeilenumbruch beim Erreichen der Begrenzung der Auswahlfläche nicht statt findet.

Wenn ich im Code hinter den entsprechenden Smilies manuell jeweils mit <br> einen Zeilenumbruch erzwinge, wird das Auswahl-Fenster auch im Gästebereich korrekt angezeigt.

Warum funktioniert dieser Zeilenumbruch im Gästebuch nicht automatisch wie überall sonst auch???

Testforum - aktuell Standard-Template - Boardnummer: 93334
Kurvenjäger - Boardnummer: 210067


 Antworten

 Beitrag melden
06.08.2009 16:09
avatar  Merk
#3 RE: Symbol-Bar / Smilies werden im Gästebuch fehlerhaft angezeigt
Me
Mitglied

Ich kann mir das eigentlich nur dadurch erkären, dass in einem übergeordneten Tag ein "nowrap" definiert wurde, was dann immer noch gilt.
Ersetze die erste Zeile der Symbolbar mit

1
<div class="iconbar" style="position: relative; display: inline; white-space: normal;">
vielleicht funktioniert es.


 Antworten

 Beitrag melden
06.08.2009 16:54
avatar  SJS.666
#4 RE: Symbol-Bar / Smilies werden im Gästebuch fehlerhaft angezeigt
SJ
Mitglied

Danke dir Merk,
So funktioniert es auch im Gästebuch einwandfrei ohne mit <br> nach jeder Reihe von Smilies arbeiten zu müssen. Mit <br> kann man es zwar auch passend machen aber man muss dann beim Ändern von Smilies immer wieder anpassen. Mit deiner Codezeile ist es optimal gelöst.

Testforum - aktuell Standard-Template - Boardnummer: 93334
Kurvenjäger - Boardnummer: 210067


 Antworten

 Beitrag melden
09.08.2009 04:08
avatar  Vitalis
#5 RE: Symbol-Bar / Smilies werden im Gästebuch fehlerhaft angezeigt
avatar
Profi

gibt dem einfach eine feste Breite und fertig :D


 Antworten

 Beitrag melden
09.08.2009 19:12
avatar  Merk
#6 RE: Symbol-Bar / Smilies werden im Gästebuch fehlerhaft angezeigt
Me
Mitglied

Zitat von Vitalis
gibt dem einfach eine feste Breite und fertig :D
Das div in dem die smilies sind hat eine feste Breite, aber die wird überschrieben, wenn der Inhalt breiter ist (das nowrap hat da wohl vorrang).


 Antworten

 Beitrag melden
10.08.2009 10:25 (zuletzt bearbeitet: 10.08.2009 10:29)
avatar  SJS.666
#7 RE: Symbol-Bar / Smilies werden im Gästebuch fehlerhaft angezeigt
SJ
Mitglied

@ Vitalis:
Breite ist ja über width=319px fest vorgeben, wird aber ignoriert und es findet kein automatischer Zeilenumbruch statt. Aber das Problem hat Merk mit dem white-space: normal ja schon aus der Welt geschafft.

Das Problem liegt definitiv im Template für den Bereich Gästebuch (also Profil?). In allen anderen Teilen des Forums funktioniert ja der ursprüngliche Code und der Zeilenumbruch erfolgt automatisch.

Testforum - aktuell Standard-Template - Boardnummer: 93334
Kurvenjäger - Boardnummer: 210067


 Antworten

 Beitrag melden
11.08.2009 20:49 (zuletzt bearbeitet: 11.08.2009 20:50)
avatar  Vitalis
#8 RE: Symbol-Bar / Smilies werden im Gästebuch fehlerhaft angezeigt
avatar
Profi

Interessant!
Mit einer ordentliche Verschachtelung könnte man da viel erreichen :)
... Aber ist ja jut nun.


 Antworten

 Beitrag melden
Bereits Mitglied?
Jetzt anmelden!
Mitglied werden?
Jetzt registrieren!