hover Effekt für alle Icons wie Original mit kleine runde Ecken ?

  • Hallo,
    ich möchte gerne die hover Farbe ändern z.B. Haus, Pfeil vor, Pfeil zurück usw wobei der Orginale hover mit den kleinen runden Ecken nicht verloren gehen soll.


    ihier mal zwei Screenshots mit dem Orihgnalen hover und das Themen "Standard", Dichte "kompakt".


    ier sieht man den hover fast garnicht
    [attachment=2]Unbenannt-1.png[/attachment]


    hier sieht man den hover besser, und mit kleinen runden Ecken
    [attachment=1]Unbenannt-2.png[/attachment]


    diesen hoover mit kleine runde Ecken möchte ich behalten und nur die Farbe ändern.


    Aber hier mit geht das nicht

    Code
    1. toolbar .toolbarbutton-1:hover{
    2. background:red!important;
    3. }


    [attachment=0]Unbenannt-3.png[/attachment]


    ich bae nur folgendes in der CSS stehen

  • Hallo
    Ich hänge mich hier mal dran da ich eine ähnliche Frage habe. Kann man den Hovereffekt für alle Icons also in der Menüleiste auch die gans links "Datei" "Ansicht" usw. plus Lesezeichenl. usw. Problemlos ändern? Möchte sie etwas kräftiger grau machen das sie sofort ins Auge fahlen.


    Danke im voraus hwww


  • die hover Farbe ändern


    Re: hover für Icon neben Menüleiste ? [GELÖST]


    Mit abgerundeten Ecken nur für dieses eine Icon.


    Code
    1. #add-ons-button:hover{
    2. background:red!important;
    3. border-radius: 7px !important;
    4. }


    Für alle Icons siehe meinen Link oben.



    in der Menüleiste


    Teste bitte:

    Code
    1. #main-menubar > menu:hover{
    2. background:red!important;
    3. border-radius: 7px !important;
    4. }


    Wert und Farbe wenn dann noch anpassen.

  • Hallo Andreas
    Erst mal danke für die schnelle Antwort!
    Wenn ich diesen Code benutze:


    "Button alle:


    toolbar .toolbarbutton-1:hover{
    background:red!important;
    }
    "
    bleiben alle Icons grau.


    Wenn ich diesen Code benutze:



    sind Die Icons 2. (siehe Bild unten) rot die Icons 1. 3. und 4. bleiben Grau.



    Ich hatte gedacht das man alle Icons 1 - 4 ändern könnte in ein z.B. kräftigeres Grau.



    [attachment=0]Unbenannt.JPG[/attachment]



    Wenn das nicht ohne weiteres möglich ist wäre es halb so schlimm.



    Gruß hwww

  • Hallo Andreas
    Habe mich wahrscheinlich wieder mal falsch ausgedrückt. Dieser Code:


    funktioniert in der Lesezeichenleiste Bild 3.


    Dieser Code:


    funktioniert in der Leiste Bild 2. (weiß nicht wie die genau heißt (URL-Leiste vielleicht?))


    Oben in der Menüleiste? Bild 1. 4. bleibt es wie es war.

  • Hallo Andreas noch mal
    Bitte vergesse den Beitrag #9.
    Ich habe noch andere Einträge in der userChrome.css z.B diesen:


    /************ Rahmen-Stärke, -Farbe, -Radius und Abstände der Buttons *************/



    Da habe ich nun bei "Hover" die Farbe geändert und das funktioniert jetzt.


    Bitte noch mal um Entschuldigung hwww


  • In Zukunft...denk bitte auch dran, du nutzt die ESR Version...und nicht die Release. :wink:
    Was in diesem Fall aber nicht so wichtig war.


    Werde mich in Zukunft bessern und es bei jeder Anfrage dabei schreiben.


    Noch eine schöne Woche wünsche ich dir hwww

  • Hallo,
    ich habe folgenden Code irgendwie gefunden

    Code
    1. #PersonalToolbar .toolbarbutton-1:not([disabled="true"]):not([checked]):not([open]):not(:active):hover,
    2. .tabbrowser-arrowscrollbox > .scrollbutton-up:not([disabled="true"]):hover,
    3. .tabbrowser-arrowscrollbox > .scrollbutton-down:not([disabled="true"]):hover,
    4. .findbar-button:not(:-moz-any([checked="true"], [disabled="true"])):hover /*,
    5. toolbarbutton.bookmark-item:not(.subviewbutton):hover:not([disabled="true"]):not([open]),
    6. toolbar .toolbarbutton-1:not([disabled="true"]):not([checked]):not([open]):not(:active):hover > .toolbarbutton-icon,
    7. toolbar .toolbarbutton-1:not([disabled="true"]):not([checked]):not([open]):not(:active):hover > .toolbarbutton-text,
    8. toolbar .toolbarbutton-1:not([disabled="true"]):not([checked]):not([open]):not(:active):hover > .toolbarbutton-badge-stack {
    9. background-color: yellow!important;
    10. color: red!important; }


    der unter Windows 7 funktioniert.
    Ich habe leider keine Ahnung was da noch alles geändert wird.


    somit bleibt wenigstens der Orginale hover erhalten.


    -Danke erstmal.