Ich habe in einer Tooltip-Bibliothek gearbeitet. Die Idee ist einfach: Fügen Sie in jedem beliebigen HTML-Elemente des benutzerdefinierte Datenattribut (ich meine data-) mit der Meldung, dass der Benutzer im Tooltip zu zeigen, zum Beispiel:Wie löst man "Wörter schneiden", wenn es Leerzeichen gibt?
<div data-msg="Message">Hover me.</div>
Wenn der Benutzer der Maus schweben Auf dem Element zeigt der Tooltip es an.
Hier ist ein Fiddle.
Wenn Sie im obigen Beispiel sehen, sehen Sie, wenn der Benutzer eine Nachricht mit Leerzeichen hinzufügt, schneidet der Browser die Wörter in die Leerzeichen, aber wenn der Benutzer eine Nachricht ohne Leerzeichen hinzufügt, schneidet der Browser nicht die Wörter (weil es keine Leerzeichen gibt). Ich habe versucht, das Problem mit white-space, break-word und text-overflow zu beheben, aber sie lösen es nicht
Dies ist sehr wichtig: Ich möchte nicht eine spezifische width setzen, für den Fall, dass der Browser die Breite des Elements automatisch berechnet. Ich könnte dieses Problem beheben, indem ich eine spezifische width hinzufüge, aber das will ich nicht.
Wenn jemand weiß, wie dieses Problem behoben wird, möchte ich mir das Verhalten dieses Problems erklären.
Danke, Leo!
Sie schaukeln funktioniert! Ich habe die Eigenschaft 'white-space' mit folgenden Werten versucht: * pre-wrap * und * pre-line *. * nowrap * Wert ist mir nicht aufgefallen. Ich dachte, dass diese Eigenschaft zusammen mit "word-wrap: break-word" seltsame Verhaltensweisen haben würde. Vielen Dank! – leoMestizo