• Recent
  • Tags
  • Unsolved
  • Solved
  • MagicMirror² Repository
  • Documentation
  • 3rd-Party-Modules
  • Donate
  • Discord
  • Register
  • Login
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 66.6k 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 Oct 26, 2018, 8:49 PM

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

    J 2 Replies Last reply Oct 26, 2018, 9:25 PM Reply Quote 0
    • J Offline
      justjim1220 Module Developer @electros
      last edited by Oct 26, 2018, 9:25 PM

      @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
      • J Offline
        justjim1220 Module Developer @electros
        last edited by Oct 26, 2018, 9:37 PM

        @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 Oct 26, 2018, 10:02 PM Reply Quote 0
        • E Offline
          electros Project Sponsor @justjim1220
          last edited by Oct 26, 2018, 10:02 PM

          @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”

          J 2 Replies Last reply Oct 26, 2018, 10:50 PM Reply Quote 0
          • J Offline
            justjim1220 Module Developer @electros
            last edited by Oct 26, 2018, 10:50 PM

            @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
            • J Offline
              justjim1220 Module Developer @electros
              last edited by Oct 26, 2018, 11:14 PM

              @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 Oct 27, 2018, 11:36 AM Reply Quote 0
              • E Offline
                electros Project Sponsor @justjim1220
                last edited by Oct 27, 2018, 11:36 AM

                @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 Oct 27, 2018, 12:17 PM

                  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?

                  J 1 Reply Last reply Oct 27, 2018, 4:35 PM Reply Quote 0
                  • J Offline
                    justjim1220 Module Developer @electros
                    last edited by Oct 27, 2018, 4:35 PM

                    @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
                    • C Offline
                      Cr4z33
                      last edited by Cr4z33 Oct 29, 2018, 9:29 AM Oct 29, 2018, 9:29 AM

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