MagicMirror Forum
    • Recent
    • Tags
    • Unsolved
    • Solved
    • MagicMirror² Repository
    • Documentation
    • 3rd-Party-Modules
    • Donate
    • Discord
    • Register
    • Login
    A New Chapter for MagicMirror: The Community Takes the Lead
    Read the statement by Michael Teeuw here.

    Change background image based on time of day

    Scheduled Pinned Locked Moved Development
    backgroundtimeofday
    18 Posts 5 Posters 9.2k Views 5 Watching
    Loading More Posts
    • 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.
    • I Offline
      I_Am_Anthony
      last edited by I_Am_Anthony

      Good catch on the missing this.config.night_background, thanks.

      I’m aware that it’s >= and &#60= The markup really hates the less than or equal sign together (because HTML apparently), so I just flipped them for the purposes of markup. Just found that I can use the escape instead: &#60=.

      Anyway, thanks to both of you @j.e.f.f and @strawberry-3-141 for the help. I’ve updated the code above to prevent repasting. I’ll get it into the mirror soon to test. If it works then I’ll package it and submit as a module.

      1 Reply Last reply Reply Quote 0
      • X Offline
        xTITUS MAXIMUSx
        last edited by

        I know this is an old topic but did you get this module finished? if do you have a git hub?

        1 Reply Last reply Reply Quote 0
        • Piranha1605P Offline
          Piranha1605
          last edited by

          ;)

          https://forum.magicmirror.builders/topic/13014/css-switch-module

          X 1 Reply Last reply Reply Quote 0
          • X Offline
            xTITUS MAXIMUSx @Piranha1605
            last edited by

            @Piranha1605

            Not exactly what I am looking for. I tried to take @I_Am_Anthony code and tweak it to my needs but, no success. maybe you’ll review my code? :)

            1 Reply Last reply Reply Quote 0
            • Piranha1605P Offline
              Piranha1605
              last edited by

              You can actually schedule all CSS entries in the module, including the background.

              X 1 Reply Last reply Reply Quote 0
              • X Offline
                xTITUS MAXIMUSx @Piranha1605
                last edited by

                @Piranha1605 Cool! how would one do that? Still a noob.

                1 Reply Last reply Reply Quote 0
                • Piranha1605P Offline
                  Piranha1605
                  last edited by

                  @xTITUS-MAXIMUSx said in Change background image based on time of day:

                  Cool! how would one do that? Still a noob.

                  • Install the module

                  • Enter the time from when to when night is in the config.

                  • Enter your background in the custom.css

                  .morning {
                    background: blue;
                  }
                  
                  .evening {
                    background: black;
                  }
                  
                  X 1 Reply Last reply Reply Quote 0
                  • X Offline
                    xTITUS MAXIMUSx @Piranha1605
                    last edited by

                    @Piranha1605 Yeah dude I took a gander at your github and then set everything to my needs. I appreciate it!

                    1 Reply Last reply Reply Quote 1
                    • 1
                    • 2
                    • 2 / 2
                    • First post
                      Last post
                    Enjoying MagicMirror? Please consider a donation!
                    MagicMirror created by Michael Teeuw.
                    Forum managed by Sam, technical setup by Karsten.
                    This forum is using NodeBB as its core | Contributors
                    Contact | Privacy Policy