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.

    MMM-NewsFeedTicker

    Scheduled Pinned Locked Moved Utilities
    94 Posts 15 Posters 69.3k Views 14 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.
    • E Offline
      electros Project Sponsor
      last edited by

      The problem is just to move that red line to bottom under the writing line and after that everything it’s fine. Thanks

      justjim1220J 2 Replies Last reply Reply Quote 0
      • justjim1220J Offline
        justjim1220 Module Developer @electros
        last edited by

        @electros

        Apologies!

        Looks like I did tell you wrong about the position…
        Here is the css that makes it work for me, try them and let me know…

        @keyframes marquee {
            0% {left: 100%;}
            100% {left: -100%;}
        }
        
        .MMM-NewsFeedTicker {
            width: 100%;
            height: 100px;
            line-height: 100%;
            overflow: hidden;
            background: none;
            margin-left: 20%;
        }
        
        .MMM-NewsFeedTicker .tickerbody {
            position: relative;
            bottom: 0;
            left: 0;
            vertical-align: middle;
            white-space: nowrap;
            text-align: left;
            animation: marquee 31s linear;
          }
        
        .MMM-NewsFeedTicker .headline {
            padding-top: 15px;
            margin: 0 auto;
            white-space: nowrap;
        }
        
        .MMM-NewsFeedTicker .image {
          position: absolute;
          display: inline-block;
          vertical-align: middle;
          bottom: 10;
          margin-left: 0;
          height: 100px;
          z-index: 10;
          background-color: #FFF;
        }
        

        "Life's Too Short To Dance With Ugly People"
        Jim Hallock - 1995

        1 Reply Last reply Reply Quote 0
        • justjim1220J Offline
          justjim1220 Module Developer @electros
          last edited by

          @electros

          what is the name of the module for the buttons?

          "Life's Too Short To Dance With Ugly People"
          Jim Hallock - 1995

          E 1 Reply Last reply Reply Quote 0
          • E Offline
            electros Project Sponsor @justjim1220
            last edited by

            @justjim1220
            Sorry but it’s not working. I copied the css you put above in MMM-NewsFeedTicker.css but it still does not work. Now it looks like that
            0_1540591080827_6.png
            Buttons are created with the module “MMM-TouchNavigation”

            justjim1220J 2 Replies Last reply Reply Quote 0
            • justjim1220J Offline
              justjim1220 Module Developer @electros
              last edited by

              @electros

              do you still have the entries you put into the custom.css?

              "Life's Too Short To Dance With Ugly People"
              Jim Hallock - 1995

              1 Reply Last reply Reply Quote 0
              • justjim1220J Offline
                justjim1220 Module Developer @electros
                last edited by

                @electros

                OK, you need to add the following to your custom.css file:

                .navigation-menu {
                    display: flex;
                    align-items: stretch;
                    position: absolute;
                }
                

                With the code I posted and this addition to the custom.css file, I was able to get this…
                0_1540595500237_Screenshot (412).png
                0_1540595512137_Screenshot (413).png 0_1540595520896_Screenshot (414).png

                If you added any NewsFeedTicker code to your custom.css file, you need to remove it.

                If you want the background color back to maroon, change the background: none; to background-color: maroon;

                "Life's Too Short To Dance With Ugly People"
                Jim Hallock - 1995

                E 1 Reply Last reply Reply Quote 0
                • E Offline
                  electros Project Sponsor @justjim1220
                  last edited by

                  @justjim1220
                  Finally it’s working now. Thank you very much:thumbs_up:

                  1 Reply Last reply Reply Quote 0
                  • E Offline
                    electros Project Sponsor
                    last edited by

                    Thank you very much for the help, but still I do not understand how you moved that red line down. I would be curious, can not get any position you want on the vertical for this module?

                    justjim1220J 1 Reply Last reply Reply Quote 0
                    • justjim1220J Offline
                      justjim1220 Module Developer @electros
                      last edited by

                      @electros

                      you should be able to place it in any of the regions,
                      it works best in the top_bar, middle_center, and bottom_bar for the 100% width

                      "Life's Too Short To Dance With Ugly People"
                      Jim Hallock - 1995

                      1 Reply Last reply Reply Quote 0
                      • Cr4z33C Offline
                        Cr4z33
                        last edited by Cr4z33

                        This post is deleted!
                        1 Reply Last reply Reply Quote 0
                        • 1
                        • 2
                        • 3
                        • 4
                        • 5
                        • 9
                        • 10
                        • 2 / 10
                        • 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