Kann zum Testen für die Templates (v1-4) in die Kopfzeile, fürs Xobor (v6) in Eigene Kopfzeile kopiert werden
Das Skript ist ziemlich groß und verhält sich im Forum in Bezug auf die Laufgeschwindigkeit positiv anders! Die Laufschrift wird nach ca. 15 Wörter sehr langsam, Zeit zum lesen! Mit einem Mausklick geht es dann flink weiter!
Auch hier war der "Endlosschleifenschutzes" von "CodePen" verbaut, habe ich deaktiviert. Siehe Endlosschleifenschutz aufheben!
Funktioniert leider nicht für mehrere Sprechblasen auf einer Seite!
Wird das Skript im Forum eingebaut, wird die jQuery-Bibliothek nicht benötigt und kann aus Zeile 178 entfernt werden
<div class="speech"> <div class="speech_content"></div> <div class="txtLine"> <div class="speech_show speech_stretch"></div> <div class="speech_hide"> Herzlich Willkommen im Forum "FUTURE" für Hilfe, Tricks und Tipps rund um den Computer! Suchen Sie Hilfe? Möchten Sie einen Beitrag leisten, vielleicht mit Ihren Erfahrungen und Kenntnissen oder einfach nur durch Ihre Meinung! Ich freue mich auf alles, was dazu beiträgt mit der heutigen Technik, mit so manchen Dingen, die in unserem Leben Fragen aufwerfen, durch dieses Forum ein Stück weiter zu kommen. Sind Sie noch nicht angemeldet oder ist dies Ihr erster Besuch, lesen Sie sich die Hilfe des Forums durch. Dort wird Ihnen die Bedienung des Forums näher erklärt. Registrieren Sie sich, um alle Funktionen dieses Forums nutzen zu können. Ich habe, weil mich die Werbeeinblendungen selber nerven und auch nicht ohne Risiko sind, mich für ein werbefreies Forum entschieden (kostenpflichtig)! Wer mich hier unterstützen will, kann das gerne tun. </div> </div> </div>
<!-- Wenn jQuery bereits vorhanden ist, kann folgende Zeile gelöscht werden! --> <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script>
Bevor man die Sprechblasen ins Forum einbaut, muss man sich mehrere Fragen stellen:
Reichen hier nicht Tooltipps aus?
Wo und wie sollen die Sprechblasen platziert werden? Als Erklärung fest auf der Webseite oder sogar in Forum-Beiträgen mit gezielter Platzierung?
Was sollen Sprechblasen im Forum alles können? Wie sieht es dann mit mehreren Sprechblasen, verschiedene Farben, Überlappung und größeren Texten aus?
Soll man die Sprechblasen verschieben oder ausblenden können?
Wie sieht es mit Animationen der Sprechblasen aus?
Installation für alle Templates
Was das folgende Skript alles kann:
Gut geeignet für Texte und Bilder, auch für mehrere Sprechblasen auf einer Seite, Pfeil zeigt nach oben!
Für jede Sprechblase kann die Schriftfarbe, Hintergrundfarbe und die Rahmenfarbe über den Forencode eingestellt werden!
Für Bilder besteht die Möglichkeit linksseitig einen Abstand einzustellen!
Die Sprechblasen sind mit einem Textüberlauf versehen. Mit einem Klick wird der ganze Text angezeigt!
Bei Überlappung wird die 1. Sprechblase nach oben gebracht (Leserichtung)!
Die Sprechblasen lassen sich mit einem Klick auf das X ausblenden, wird nicht gespeichert!
Animation und Verschieben für Text und Bildbeschreibungen haben sich nicht als besonders vorteilhaft erwiesen, sind nicht eingebaut!
Auch gut geeignet für die mobile Version!
Text Text Text Te
Überlagerte Sprechblasen. Leserichtng von oben nach unten.
✕
xt Text Text Text Text Text Text ! Test Test Test Te Test Test Test Test Test Test Test Test Test Test Test Test Test Text Text Text Text Te
Überlagerte Sprechblasen. Leserichtng von oben nach unten.
✕
xt Text Text Text Text Text Text ! Test Test Test Te Test Test Test Test Test Test Test Test Test Test Test Test Test Text Text Text Text Text Te
Überlagerte Sprechblasen. Leserichtng von oben nach unten.
✕
xt Text Text Text Text Text Text ! Test Test Test Te Test Test Test Test Test Test Test Test Test Test Test Test Test Text Text Text Text Text Text Text Text Text Text Text Text Text ! Test Test Test Te Test Test Test Test Test Test Test Test Test Test Test Test Test Text Text Text Text Text Text Text Text Text Text Text Text Text !
Farbige Sprechblasen. Mit Überlauf, mit Überlauf, mit Überlauf, mit Überlauf, mit Überlauf, mit Überlauf, mit Überlauf, mit Überlauf, mit Überlauf, mit Überlauf, mit Überlauf, mit Überlauf, mit Überlauf, mit Überlauf, mit Überlauf!
✕
xt Text Text Text Text Text Text ! Test Test Test Te Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Te Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Text Text Text Text Text Text Text Text Text Text Text Text Text ! Text Text Text Text Text Te
Farbige Sprechblasen. Mit Überlauf, mit Überlauf, mit Überlauf, mit Überlauf, mit Überlauf, mit Überlauf, mit Überlauf, mit Überlauf, mit Überlauf, mit Überlauf, mit Überlauf, mit Überlauf, mit Überlauf, mit Überlauf, mit Überlauf!
✕
xt Text Text Text Text Text Text ! Test Test Test Te Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Te Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Text Text Text Text Text Text Text Text Text Text Text Text Text ! Text Text Text Text Text Text Te
Farbige Sprechblasen. Mit Überlauf, mit Überlauf, mit Überlauf, mit Überlauf, mit Überlauf, mit Überlauf, mit Überlauf, mit Überlauf, mit Überlauf, mit Überlauf, mit Überlauf, mit Überlauf, mit Überlauf, mit Überlauf, mit Überlauf!
✕
xt Text Text Text Text Text Text ! Test Test Test Te Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Text Text Text Text Text Text Text Text Text Text Text Text Text ! Test Test Test Te Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test
Überlagerte Sprechblasen. Leserichtng von oben nach unten.
✕
xt Text Text Text Text Text Text ! Test Test Test Te Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Text Text Text Text Te
Überlagerte Sprechblasen. Leserichtng von oben nach unten.
✕
xt Text Text Text Text Text Text ! Test Test Test Te Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Text Text Text Text Text Te
Überlagerte Sprechblasen. Leserichtng von oben nach unten.
✕
xt Text Text Text Text Text Text ! Test Test Test Te Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Text Text Text Text Text Text Te
Überlagerte Sprechblasen. Leserichtng von oben nach unten.
✕
xt Text Text Text Text Text Text ! Test Test Test Te Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Text Text Text Text Text Text Text Text Text Text Text Text Text ! Test Test Test Te Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Text Text Text Text Text Text Text Text Text Text Text Text Text ! Test Test Test Te Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test Test
<p> <b><u>Hat der Röhrenverstärker ausgedient?</u></b> <br> Meistens sind die technischen Daten eines modernen Transistor Verstärker weitaus besser als die eines Röhrenverstärker. Doch die Entwicklung eines Röhrenverstärkers ist auch nicht stehen geblieben. So gibt es heute neue Konzepte, auch wurden neue Röhren entwickelt. Manch ältere Typen wurden neu modifiziert. Das Kern Material für Ausgangsübertrager ist heute von der Belastbarkeit besser. So sind die Übertrager bei gleichen Daten kleiner geworden. Das Kernmaterial (Ferrit) erzeugt eine höhere Induktivität im Gegensatz zu den ersten Übertragern, die auf den Markt kamen. </p>
$('.sprechblase1 p').each(function(index, e) { // debugger; if(e.offsetWidth !== e.scrollWidth){ $('.sprech1 p').attr('title','Sprechblase mit einem Klick öffnen oder schließen!') } });
}); </script>
Schließen
Durch die VAR-Funktion in der CSS und im Foren-Code ist es möglich, mit einer Farbangabe im Beitrag das farbliche Aussehen der Sprechblase zu bestimmen, Top!
Der CSS-Eintrag und das Skript wird als PIugin in "Untere Leiste - header" kopiert!
Wichtig! Im Plugin müssen rechts oben "Unterstützte Templates" markiert werden, z.B.: Business - Template (144) und Mobile - Template (177) (Auswahl mit Mausklick oder Strg + Mausklick)!
In Zeile 29 wird die max. Länge der Sprechblase angepasst!
Zeile 90-92 sorgen für das Ausblenden der Sprechblase (Klick auf das "X"!)
Zeile 94-97 öffnen und schließen die Sprechblase bei überlangen Texten
Zeile 99-107 sorgen dafür, dass die erste oberste Sprechblase bei Überlappung oben liegt!
Zeile 110-116 blenden einen Tooltipp bei Textüberlauf der Sprechblase ein!
So sieht die Sprechblase nach einem Klick im Forum-Beitrag aus:
Die Sprechblase wird immer unterhalb des zu beschreibenden Elem
Sprechblase mit Überlauf - Sprechblase mit einem Klick öffnen oder schließen!
✕
ents platziert! Der BB-Code wird an die Stelle geschoben, auf die der Pfeil zeigen soll, kann auch mitten im Wort oder Satz sein! Stört die Sprechblase, kann sie ausgeblendet werden!
Animierte Sprechblasen als Überschrift in Forum Beiträgen - Teil 2
Im zweiten Teil geht es um animierte Sprechblasen! Um sie im Forum wie in Teil 1 in Texten und unter Bildern ordentlich zu platzieren, habe ich noch kein gutes Skript hinbekommen! Aber sie lassen sich als Überschriften universell gut einsetzen!
Herzlich Willkommen im Forum "FUTURE" für Hilfe, Tricks und Tipps
Mit wenig Text, ohne Zeilenumbruch!
Herzlich Willkommen im Forum "FUTURE" für Hilfe, Tricks und Tipps rund um den Computer! Suchen Sie Hilfe? Möchten Sie einen Beitrag leisten, vielleicht mit Ihren Erfahrungen und Kenntnissen oder einfach nur durch Ihre Meinung! Ich freue mich auf alles, was dazu beiträgt mit der heutigen Technik, mit so manchen Dingen, die in unserem Leben Fragen aufwerfen, durch dieses Forum ein Stück weiter zu kommen. Sind Sie noch nicht angemeldet oder ist dies Ihr erster Besuch, lesen Sie sich die Hilfe des Forums durch. Dort wird Ihnen die Bedienung des Forums näher erklärt. Registrieren Sie sich, um alle Funktionen dieses Forums nutzen zu können. Ich habe, weil mich die Werbeeinblendungen selber nerven und auch nicht ohne Risiko sind, mich für ein werbefreies Forum entschieden (kostenpflichtig)! Wer mich hier unterstützen will, kann das gerne tun.
Mit viel Text, Zeilenumbruch und Textüberlauf!
Installation für alle Templates
Was das folgende Skript alles kann:
Gut geeignet für Überschriften, auch für mehrere Sprechblasen auf einer Seite, Pfeil zeigt nach unten!
Für jede Sprechblase kann die Schriftfarbe, Hintergrundfarbe und die Rahmenfarbe über den Forencode eingestellt werden!
Für jede animierte Sprechblase kann ein linksseitiger Abstand eingestellt werden!
Die Sprechblasen sind mit einem Textüberlauf versehen. Mit einem Klick wird der ganze Text angezeigt!
Auch gut geeignet für die mobile Version!
Nachteile, was das folgende Skript nicht kann:
Sind mehrere Sprechblasen auf einer Seite, wird die Breite jeder Sprechblase auf die Breite der längsten Sprechblase eingestellt!
Die animierte Sprechblase hat immer Linksanschlag und kann mit einem Werte im Foren-Code linksseitig eingestellt werden!
Herzlich Willkommen im Forum "FUTURE" für Hilfe, Tricks und Tipps
Mit wenig Text, ohne Umbruch!
Herzlich Willkommen im Forum "FUTURE" für Hilfe, Tricks und Tipps rund um den Computer! Suchen Sie Hilfe? Möchten Sie einen Beitrag leisten, vielleicht mit Ihren Erfahrungen und Kenntnissen oder einfach nur durch Ihre Meinung! Ich freue mich auf alles, was dazu beiträgt mit der heutigen Technik, mit so manchen Dingen, die in unserem Leben Fragen aufwerfen, durch dieses Forum ein Stück weiter zu kommen. Sind Sie noch nicht angemeldet oder ist dies Ihr erster Besuch, lesen Sie sich die Hilfe des Forums durch. Dort wird Ihnen die Bedienung des Forums näher erklärt. Registrieren Sie sich, um alle Funktionen dieses Forums nutzen zu können. Ich habe, weil mich die Werbeeinblendungen selber nerven und auch nicht ohne Risiko sind, mich für ein werbefreies Forum entschieden (kostenpflichtig)! Wer mich hier unterstützen will, kann das gerne tun.
Durch die VAR-Funktion in der CSS und im Foren-Code ist es möglich, mit einer Farbangabe im Beitrag das farbliche Aussehen der Sprechblase zu bestimmen, Top!
Die eigentliche Sprechblase befindet sich Zeile 72-83.
In Zeile 3-5 können die Farben der Sprechblase eingestellt werden!
In Zeile 77-80 kann der Text der Sprechblase angepasst und formatiert werden!
Zeile 101-103 sorgen bei überlangen Text für das Öffnen der Sprechblase!
In Zeile 96 kann die Zeit der Animation eingestellt werden, hier 4s (4 Sekunden)! Fügt man "infinite oder alternate" hinter der vorletzten Klammer ein, kann die Art der Animation noch verändert werden!
<div class="sprechblase2"> <div class="forum_sprech2"> <p title="Sprechblase bei Überlauf mit einem Klick öffnen oder schließen!">
<b><u>Hat der Röhrenverstärker ausgedient?</u></b> <br> Meistens sind die technischen Daten eines modernen Transistor Verstärker weitaus besser als die eines Röhrenverstärker. Doch die Entwicklung eines Röhrenverstärkers ist auch nicht stehen geblieben. So gibt es heute neue Konzepte, auch wurden neue Röhren entwickelt. Manch ältere Typen wurden neu modifiziert. Das Kern Material für Ausgangsübertrager ist heute von der Belastbarkeit besser. So sind die Übertrager bei gleichen Daten kleiner geworden. Das Kernmaterial (Ferrit) erzeugt eine höhere Induktivität im Gegensatz zu den ersten Übertragern, die auf den Markt kamen.
Durch die VAR-Funktion in der CSS und im Foren-Code ist es möglich, mit einer Farbangabe im Beitrag das farbliche Aussehen der Sprechblase zu bestimmen, Top!
Der CSS-Eintrag und das Skript wird als PIugin in "Untere Leiste - header" kopiert!
Wichtig! Im Plugin müssen rechts oben "Unterstützte Templates" markiert werden, z.B.: Business - Template (144) und Mobile - Template (177) (Auswahl mit Mausklick oder Strg + Mausklick)!
In Zeile 29 wird die max. Länge der Sprechblase angepasst!
In Zeile 3-5 können die Farben der Sprechblase eingestellt werden!
Zeile 76-78 sorgen bei überlangen Text für das Öffnen der Sprechblase!
In Zeile 71 kann die Zeit der Animation eingestellt werden, hier 4s (4 Sekunden)! Fügt man "infinite oder alternate" hinter der vorletzten Klammer ein, kann die Art der Animation noch verändert werden!