Skip to content
  • Recent
  • Tags
  • 0 Unread 0
  • Categories
  • Unreplied
  • Popular
  • GitHub
  • Docu
  • Hilfe
Skins
  • Light
  • Brite
  • Cerulean
  • Cosmo
  • Flatly
  • Journal
  • Litera
  • Lumen
  • Lux
  • Materia
  • Minty
  • Morph
  • Pulse
  • Sandstone
  • Simplex
  • Sketchy
  • Spacelab
  • United
  • Yeti
  • Zephyr
  • Dark
  • Cyborg
  • Darkly
  • Quartz
  • Slate
  • Solar
  • Superhero
  • Vapor

  • Default (No Skin)
  • No Skin
Collapse
Logo
  1. ioBroker Community Home
  2. Deutsch
  3. Visualisierung
  4. Farbe vom NAV Button ändern

NEWS

  • UPDATE 31.10.: Amazon Alexa - ioBroker Skill läuft aus ?
    apollon77A
    apollon77
    48
    3
    8.0k

  • Monatsrückblick – September 2025
    BluefoxB
    Bluefox
    13
    1
    1.8k

  • Neues Video "KI im Smart Home" - ioBroker plus n8n
    BluefoxB
    Bluefox
    15
    1
    2.0k

Farbe vom NAV Button ändern

Farbe vom NAV Button ändern

Scheduled Pinned Locked Moved Visualisierung
35 Posts 7 Posters 8.1k Views 3 Watching
  • Oldest to Newest
  • Newest to Oldest
  • Most Votes
Reply
  • Reply as topic
Log in to reply
This topic has been deleted. Only users with topic management privileges can see it.
  • PeoplesP Offline
    PeoplesP Offline
    Peoples
    wrote on last edited by
    #13

    Ich benutze die App nicht ich nutze Fully, aber es gab widgets bei denen das nicht zuverlässig funktioniert hat. Funktioniert es im Browser?

    Ich beantworte keine Fragen zu Themen via PN

    1 Reply Last reply
    0
    • S Offline
      S Offline
      sveni_lee
      wrote on last edited by
      #14

      auch nur wenn man den Browser aktualisiert…

      1 Reply Last reply
      0
      • PeoplesP Offline
        PeoplesP Offline
        Peoples
        wrote on last edited by
        #15

        Stell Mal deinen Widget-Export ein dann kann ich's Mal bei mir versuchen

        Ich beantworte keine Fragen zu Themen via PN

        1 Reply Last reply
        0
        • S Offline
          S Offline
          sveni_lee
          wrote on last edited by
          #16

          klar kein Problem…

          [{"tpl":"tplJquiIconNav","data":{"g_fixed":true,"g_visibility":false,"g_css_font_text":true,"g_css_background":true,"g_css_shadow_padding":false,"g_css_border":false,"g_gestures":false,"g_signals":false,"g_last_change":false,"visibility-cond":"==","visibility-val":1,"visibility-groups-action":"hide","signals-cond-0":"==","signals-val-0":true,"signals-icon-0":"/vis/signals/lowbattery.png","signals-icon-size-0":0,"signals-blink-0":false,"signals-horz-0":0,"signals-vert-0":0,"signals-hide-edit-0":false,"signals-cond-1":"==","signals-val-1":true,"signals-icon-1":"/vis/signals/lowbattery.png","signals-icon-size-1":0,"signals-blink-1":false,"signals-horz-1":0,"signals-vert-1":0,"signals-hide-edit-1":false,"signals-cond-2":"==","signals-val-2":true,"signals-icon-2":"/vis/signals/lowbattery.png","signals-icon-size-2":0,"signals-blink-2":false,"signals-horz-2":0,"signals-vert-2":0,"signals-hide-edit-2":false,"lc-type":"last-change","lc-is-interval":true,"lc-is-moment":false,"lc-format":"","lc-position-vert":"top","lc-position-horz":"right","lc-offset-vert":0,"lc-offset-horz":0,"lc-font-size":"12px","lc-font-family":"","lc-font-style":"","lc-bkg-color":"","lc-color":"","lc-border-width":"0","lc-border-style":"","lc-border-color":"","lc-border-radius":10,"lc-zindex":0,"name":"Garten","text":"Garten","nav_view":"04_Garten","show_effect":""},"style":{"left":"222px","top":"44px","width":"110px","height":"44px","color":"white","background":"{v:vis.0.control.data;v == \"main/04_Garten\" ? \"#0000FF\" : \"#000000\"}","z-index":"2","line-height":"44px"},"widgetSet":"jqui"}]
          

          Danke für´s ansehen

          1 Reply Last reply
          0
          • PeoplesP Offline
            PeoplesP Offline
            Peoples
            wrote on last edited by
            #17

            Ich denke dass du das schon richtig gemacht hast, damals gab es mal ein Thema bei dem ebenfalls jemand einen Button "einfärben" wollte das hat damals denke ich auch nicht über Bindings funktioniert

            Finde den Beitrag aber grade nicht

            Ich beantworte keine Fragen zu Themen via PN

            1 Reply Last reply
            0
            • S Offline
              S Offline
              sveni_lee
              wrote on last edited by
              #18

              das fuktioniert schon, das Problem ist nur das der View 05_Nav nicht "aktualisiert" wird.

              eventuell ließe sich ja was über css machen…

              ich nehme an, das Widget "basic - view in Widget" aktualisiert den inhalt des views nicht. denn wenn man den browser aktualisiert

              wird es korrekt angezeigt...

              1 Reply Last reply
              0
              • PeoplesP Offline
                PeoplesP Offline
                Peoples
                wrote on last edited by
                #19

                Beim HTML Widget lässt sich eine Aktualisierungszeit Einstellungen das gibt's aber hier nicht oder

                Ich beantworte keine Fragen zu Themen via PN

                1 Reply Last reply
                0
                • S Offline
                  S Offline
                  sveni_lee
                  wrote on last edited by
                  #20

                  nein, leider nicht… darum der Gedanke an css oder auch ein script...

                  1 Reply Last reply
                  0
                  • Karel PuhliK Offline
                    Karel PuhliK Offline
                    Karel Puhli
                    wrote on last edited by
                    #21

                    Mahlzeit zusammen,
                    ich greife die Frage von karlheinz001 mal auf. Ich stehe vor dem selben Problem. Wie lässt sich die Farbe ändern? Über background-color bekommt man nur die dahinter liegende Farbe (über Erhöhung des Padding gut sichtbar) geändert, nicht den eigentlichen Button selbst. Weiß jemand weiter?

                    GlasfaserG 1 Reply Last reply
                    0
                    • Karel PuhliK Karel Puhli

                      Mahlzeit zusammen,
                      ich greife die Frage von karlheinz001 mal auf. Ich stehe vor dem selben Problem. Wie lässt sich die Farbe ändern? Über background-color bekommt man nur die dahinter liegende Farbe (über Erhöhung des Padding gut sichtbar) geändert, nicht den eigentlichen Button selbst. Weiß jemand weiter?

                      GlasfaserG Offline
                      GlasfaserG Offline
                      Glasfaser
                      wrote on last edited by
                      #22

                      @Karel-Puhli

                      1.JPG

                      und das in CSS Projekt eintragen :

                      .UiStyle .ui-button {
                      background: purple !important;
                      }
                      

                      2.JPG

                      .UiStyle .ui-button {
                      background: linear-gradient(0deg, #2c2a3f, #4f344c, #2c2a3f) !important;
                      }
                      

                      22.JPG

                      .UiStyle .ui-button {
                      background: linear-gradient(90deg, rgba(44,42,63,1) 2%, rgba(171,208,215,0.7680205871411064) 50%, rgba(44,42,63,1) 98%) !important;
                      }
                      

                      Synology 918+ 16GB - ioBroker in Docker v9 , VISO auf Trekstor Primebook C13 13,3" , Hikvision Domkameras mit Surveillance Station .. CCU RaspberryMatic in Synology VM .. Zigbee CC2538+CC2592 .. Sonoff .. KNX .. Modbus ..

                      Karel PuhliK 1 Reply Last reply
                      0
                      • GlasfaserG Glasfaser

                        @Karel-Puhli

                        1.JPG

                        und das in CSS Projekt eintragen :

                        .UiStyle .ui-button {
                        background: purple !important;
                        }
                        

                        2.JPG

                        .UiStyle .ui-button {
                        background: linear-gradient(0deg, #2c2a3f, #4f344c, #2c2a3f) !important;
                        }
                        

                        22.JPG

                        .UiStyle .ui-button {
                        background: linear-gradient(90deg, rgba(44,42,63,1) 2%, rgba(171,208,215,0.7680205871411064) 50%, rgba(44,42,63,1) 98%) !important;
                        }
                        
                        Karel PuhliK Offline
                        Karel PuhliK Offline
                        Karel Puhli
                        wrote on last edited by
                        #23

                        @Glasfaser said in Farbe vom NAV Button ändern:

                        .UiStyle .ui-button {

                        Perfekt! Ich danke Dir!
                        Kannst du kurz erklären, wofür das ".ui-button" steht?

                        GlasfaserG 1 Reply Last reply
                        0
                        • Karel PuhliK Karel Puhli

                          @Glasfaser said in Farbe vom NAV Button ändern:

                          .UiStyle .ui-button {

                          Perfekt! Ich danke Dir!
                          Kannst du kurz erklären, wofür das ".ui-button" steht?

                          GlasfaserG Offline
                          GlasfaserG Offline
                          Glasfaser
                          wrote on last edited by
                          #24

                          @Karel-Puhli

                          wofür das ".ui-button" steht?

                          Ist kein Geheimniss ...

                          siehe hier :

                          1.JPG

                          Synology 918+ 16GB - ioBroker in Docker v9 , VISO auf Trekstor Primebook C13 13,3" , Hikvision Domkameras mit Surveillance Station .. CCU RaspberryMatic in Synology VM .. Zigbee CC2538+CC2592 .. Sonoff .. KNX .. Modbus ..

                          Karel PuhliK 2 Replies Last reply
                          0
                          • GlasfaserG Glasfaser

                            @Karel-Puhli

                            wofür das ".ui-button" steht?

                            Ist kein Geheimniss ...

                            siehe hier :

                            1.JPG

                            Karel PuhliK Offline
                            Karel PuhliK Offline
                            Karel Puhli
                            wrote on last edited by
                            #25

                            @Glasfaser

                            ... einfach mal ins Widget rein schauen... 👍

                            Ich danke Dir!!!

                            1 Reply Last reply
                            1
                            • GlasfaserG Glasfaser

                              @Karel-Puhli

                              wofür das ".ui-button" steht?

                              Ist kein Geheimniss ...

                              siehe hier :

                              1.JPG

                              Karel PuhliK Offline
                              Karel PuhliK Offline
                              Karel Puhli
                              wrote on last edited by
                              #26

                              @glasfaser

                              Nabend!
                              Ich kriege den jqui Slider nicht farbig...
                              Egal welche class ich davon nehme, das Teil wird zwar im Edit rot (siehe Screenshot), aber im Runtime springt es nach einer gefühlten ms wieder auf weiß zurück... Woran kann das liegen, was mache ich falsch?
                              Grüße!
                              Karel Bildschirmfoto vom 2022-08-19 21-56-47.png

                              GlasfaserG 1 Reply Last reply
                              0
                              • Karel PuhliK Karel Puhli

                                @glasfaser

                                Nabend!
                                Ich kriege den jqui Slider nicht farbig...
                                Egal welche class ich davon nehme, das Teil wird zwar im Edit rot (siehe Screenshot), aber im Runtime springt es nach einer gefühlten ms wieder auf weiß zurück... Woran kann das liegen, was mache ich falsch?
                                Grüße!
                                Karel Bildschirmfoto vom 2022-08-19 21-56-47.png

                                GlasfaserG Offline
                                GlasfaserG Offline
                                Glasfaser
                                wrote on last edited by
                                #27

                                @karel-puhli sagte in Farbe vom NAV Button ändern:

                                Ich kriege den jqui Slider nicht farbig...

                                und wie ist dein CSS dazu !?

                                Synology 918+ 16GB - ioBroker in Docker v9 , VISO auf Trekstor Primebook C13 13,3" , Hikvision Domkameras mit Surveillance Station .. CCU RaspberryMatic in Synology VM .. Zigbee CC2538+CC2592 .. Sonoff .. KNX .. Modbus ..

                                Karel PuhliK 1 Reply Last reply
                                0
                                • GlasfaserG Glasfaser

                                  @karel-puhli sagte in Farbe vom NAV Button ändern:

                                  Ich kriege den jqui Slider nicht farbig...

                                  und wie ist dein CSS dazu !?

                                  Karel PuhliK Offline
                                  Karel PuhliK Offline
                                  Karel Puhli
                                  wrote on last edited by Karel Puhli
                                  #28

                                  @glasfaser

                                  ich habe eigentlich alle Möglichkeiten (siehe links blau hinterlegt) ausprobiert. In dem Beispiel ist es

                                  .Button .ui-widget-content {
                                      background-color: red;
                                  }
                                  

                                  Edit: .Button ist dabei natürlich die Klasse des Widgets

                                  GlasfaserG 1 Reply Last reply
                                  0
                                  • Karel PuhliK Karel Puhli

                                    @glasfaser

                                    ich habe eigentlich alle Möglichkeiten (siehe links blau hinterlegt) ausprobiert. In dem Beispiel ist es

                                    .Button .ui-widget-content {
                                        background-color: red;
                                    }
                                    

                                    Edit: .Button ist dabei natürlich die Klasse des Widgets

                                    GlasfaserG Offline
                                    GlasfaserG Offline
                                    Glasfaser
                                    wrote on last edited by
                                    #29

                                    @karel-puhli

                                    Was möchtest du vom Slider genau rot haben .

                                    Synology 918+ 16GB - ioBroker in Docker v9 , VISO auf Trekstor Primebook C13 13,3" , Hikvision Domkameras mit Surveillance Station .. CCU RaspberryMatic in Synology VM .. Zigbee CC2538+CC2592 .. Sonoff .. KNX .. Modbus ..

                                    Karel PuhliK 2 Replies Last reply
                                    0
                                    • GlasfaserG Glasfaser

                                      @karel-puhli

                                      Was möchtest du vom Slider genau rot haben .

                                      Karel PuhliK Offline
                                      Karel PuhliK Offline
                                      Karel Puhli
                                      wrote on last edited by
                                      #30

                                      @glasfaser

                                      Den dicken Balken in der Mitte. Also eigentlich alles außer dem "handle".

                                      1 Reply Last reply
                                      0
                                      • GlasfaserG Glasfaser

                                        @karel-puhli

                                        Was möchtest du vom Slider genau rot haben .

                                        Karel PuhliK Offline
                                        Karel PuhliK Offline
                                        Karel Puhli
                                        wrote on last edited by
                                        #31

                                        @glasfaser

                                        Im Edit wird es richtig angezeigt... 😡
                                        Bildschirmfoto vom 2022-08-19 22-11-59.png

                                        HomoranH GlasfaserG 2 Replies Last reply
                                        0
                                        • Karel PuhliK Karel Puhli

                                          @glasfaser

                                          Im Edit wird es richtig angezeigt... 😡
                                          Bildschirmfoto vom 2022-08-19 22-11-59.png

                                          HomoranH Do not disturb
                                          HomoranH Do not disturb
                                          Homoran
                                          Global Moderator Administrators
                                          wrote on last edited by
                                          #32

                                          @karel-puhli mal ein anderes Theme versucht?

                                          kein Support per PN! - Fragen im Forum stellen - es gibt fast nichts, was nicht auch für andere interessant ist.

                                          Benutzt das Voting rechts unten im Beitrag wenn er euch geholfen hat.

                                          der Installationsfixer: curl -fsL https://iobroker.net/fix.sh | bash -

                                          Karel PuhliK 1 Reply Last reply
                                          0
                                          Reply
                                          • Reply as topic
                                          Log in to reply
                                          • Oldest to Newest
                                          • Newest to Oldest
                                          • Most Votes


                                          Support us

                                          ioBroker
                                          Community Adapters
                                          Donate

                                          320

                                          Online

                                          32.4k

                                          Users

                                          81.3k

                                          Topics

                                          1.3m

                                          Posts
                                          Community
                                          Impressum | Datenschutz-Bestimmungen | Nutzungsbedingungen
                                          ioBroker Community 2014-2025
                                          logo
                                          • Login

                                          • Don't have an account? Register

                                          • Login or register to search.
                                          • First post
                                            Last post
                                          0
                                          • Recent
                                          • Tags
                                          • Unread 0
                                          • Categories
                                          • Unreplied
                                          • Popular
                                          • GitHub
                                          • Docu
                                          • Hilfe