css-Code für den Titel der alle Bereiche von einer bestimmten Klasse

Bin ich mit javascript dynamisch hinzufügen Spannweiten über html auf meiner Seite, und geben diese erstreckt sich über die Klasse "query_error" und einen dynamischen Titel basierend auf dem Wert von err_msg, e.g,

"<span class=query_error title='" + err_msg + "'>" + replacement + "</span>"

(wobei "Ersatz" ist einfach der text, der die query error). All dies funktioniert einwandfrei, und ich kann css anzuwenden, um die Spannweite mit

.query_error{
    font-family: "Monaco", "Inconsolata", Courier, monospace;
    font-size: 15px;
    font-weight: bold;
    color: red;
}

Aber ich kann nicht herausfinden, wie Sie css, um den Titel selbst, so kann ich die schriftart ändern, Farbe, Größe, etc. Ist dies möglich (ohne ein plugin)?
TIA

Siehe stackoverflow.com/questions/1055581/... - Nein, du kannst es nicht, aber es gibt einige gute alternativen gibt.

InformationsquelleAutor davej | 2012-02-05

  1. 3

    Mit CSS3 kann man nun Ziel die [title] - Attribut, sondern als eine Reale Welt Lösung sehe ich keine. Ich würde eher vorschlagen, du benutzt ein plugin wie tipsy für diese Aufgabe, da es mehr cross-browser unterstützt und weniger Aufwand.

    Dies ist eine demo von einer gestalteten [title] Attribut:

    CSS

    span:hover {
    color: red;
    position: relative;
}

span[title]:hover:after {
    content: attr(title);
    padding: 4px 8px;
    color: #333;
    position: absolute;
    left: 0;
    top: 100%;
    white-space: nowrap;
    z-index: 20px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px;
    -moz-box-shadow: 0px 0px 4px #222;
    -webkit-box-shadow: 0px 0px 4px #222;
    box-shadow: 0px 0px 4px #222;
    background-image: -moz-linear-gradient(top, #eeeeee, #cccccc);
    background-image: -webkit-gradient(linear,left top,left bottom,color-stop(0, #eeeeee),color-stop(1, #cccccc));
    background-image: -webkit-linear-gradient(top, #eeeeee, #cccccc);
    background-image: -moz-linear-gradient(top, #eeeeee, #cccccc);
    background-image: -ms-linear-gradient(top, #eeeeee, #cccccc);
    background-image: -o-linear-gradient(top, #eeeeee, #cccccc);
}

    Demo: http://jsfiddle.net/BvGHS/

    Interessant, ich wusste nicht, dass. Mein browser-tooltip angezeigt wird, oben auf die Spitze, obwohl.
    ja, die Nebenwirkungen, die nicht vermieden werden können, wenn welche auf die [title] - Attribut. Wieder, sehe keine Reale Anwendung für das CSS, aber sein dort!
    Vielen Dank,

    InformationsquelleAutor Andres Ilich

  2. 1

    Kurze Antwort, nop. Die title Attribut ist, dass ein Titel nicht mehr und kann nicht formatiert werden.
    Lange Antwort, müssen Sie wahrscheinlich ein tooltip-plugin für dies ersetzt den Titel mit einem html-element.

    InformationsquelleAutor elclanrs

  3. 1

    Die QuickInfo, die angezeigt wird, wenn Sie bewegen Sie Ihren cursor über ein element mit dem optionalen Attribut title ist eine browser-Funktion und kann, soweit ich weiß, nicht mithilfe von CSS gestaltet.

    Können Sie erstellen Sie Ihre eigenen benutzerdefinierte tooltips mit JavaScript. Es gibt ein paar plugins und tutorials auf dem web.

    InformationsquelleAutor Lucius

Schreibe einen Kommentar