[MMM-NewsFeedTicker] scroll from left to right only?

[Cr4z33]

Can someone please tell me what to edit to have the news scrolling from left to right only (and not also from right to left)?

@-webkit-keyframes marquee {
  0% { left: 100%; }
  100% { left: -100%; }
}

@-moz-keyframes marquee {
  0% { left: 100%; }
  100% { left: -100%; }
}

@-ms-keyframes marquee {
  0% { left: 100%; }
  100% { left: -100%; }
}

@-o-keyframes marquee {
  0% { left: 100%; }
  100% { left: -100%; }
}

@keyframes marquee {
  0% { left: 100%; }
  100% { left: -100%; }
}

.MMM-NewsFeedTicker {
  width: 100%;
  height: 50px;
  line-height: 100%;
  overflow: hidden;
  background: rgb(104, 9, 9); /* background color - change to 'none' if don't want */
}

.MMM-NewsFeedTicker .tickerbody {
  margin: 0 auto;
  width: 100%;
  padding-top: 5px;
  position: relative;
  white-space: nowrap;
  overflow: visible;
  -webkit-animation: marquee linear infinite;
  -moz-animation: marquee linear infinite;
  -ms-animation: marquee linear infinite;
  -o-animation: marquee linear infinite;
  animation: marquee linear infinite;
}

.MMM-NewsFeedTicker .headline {
  font-size: 40px;
  font-weight: bold;
}

.MMM-NewsFeedTicker .image {
  position: absolute;
  display: inline-block;
  vertical-align: middle;
  bottom: 0;
  left: 0;
  height: 50px;
  z-index: 100;
  background: rgb(255, 255, 255); /* white background for image */
}

[sdetweil]

@Cr4z33 see
https://www.quackit.com/css/codes/marquees/

[Cr4z33]

@sdetweil thanks I already saw that page, but it talks about translateX and there’s no evidence of it in that module’s CSS.

[sdetweil]

@Cr4z33 ok, so. try it. maybe the default is right to left if not specified.

worst case u have the existing file still

[Cr4z33]

@sdetweil nope I didn’t get what I wanted. :person_shrugging_medium-dark_skin_tone:

[A Former User]

@Cr4z33 : see this

I think it can help

[sdetweil]

i did this, commented out the old in the MMM-NewsFeedTicker.css
and replaced with this

/*@-webkit-keyframes marquee {
  0% { left: 100%; }
  100% { left: -100%; }
}

@-moz-keyframes marquee {
  0% { left: 100%; }
  100% { left: -100%; }
}

@-ms-keyframes marquee {
  0% { left: 100%; }
  100% { left: -100%; }
}

@-o-keyframes marquee {
  0% { left: 100%; }
  100% { left: -100%; }
}

@keyframes marquee {
  0% { left: 100%; }
  100% { left: -100%; }
} */

/* new stuff here */
@keyframes marquee {
  
   0% {
    transform: translate(-100%, 0);
  }

  50% {
    transform: translate(-50%, 0);
  }

  100% {
    transform: translate(0, 0);
  } 
}

[Cr4z33]

@sdetweil thank you gonna try asap! :D

[Cr4z33]

OK this is getting weird now because I applied the above code and it STILL keeps scrolling back and forth! :anguished_face:

[sdetweil]

@Cr4z33 did u delete the old code?

/*@-webkit-keyframes marquee {
  0% { left: 100%; }
  100% { left: -100%; }
}

@-moz-keyframes marquee {
  0% { left: 100%; }
  100% { left: -100%; }
}

@-ms-keyframes marquee {
  0% { left: 100%; }
  100% { left: -100%; }
}

@-o-keyframes marquee {
  0% { left: 100%; }
  100% { left: -100%; }
}

@keyframes marquee {
  0% { left: 100%; }
  100% { left: -100%; }
} */

notice the /* and */

[Cr4z33]

@sdetweil of course I did. :)

[sdetweil]

@Cr4z33 whoops. left out a change comment out the animations for other browsers

.MMM-NewsFeedTicker .tickerbody {
  margin: 0 auto;
  width: 100%;
  padding-top: 5px;
  position: relative;
  white-space: nowrap;
  overflow: visible;
  /*-webkit-animation: marquee linear infinite;
  -moz-animation: marquee linear infinite;
  -ms-animation: marquee linear infinite;
  -o-animation: marquee linear infinite; */
  animation: marquee linear infinite;
}

weird… on 2.11 it scrolls right to left
on 2.12 is scrolls left to right

[sdetweil]

i installed it again on my desktop system (from laptop), and it works as expected (on MM 2.12)

[Cr4z33]

@sdetweil nope mine ist still going back and forth.

[sdetweil]

@Cr4z33 weird… I just re-installed MM and the module and changed the css and changed the newsfeed module config entry to MMM-NewsFeedTicker and started, left to right

		{
			module: "MMM-NewsFeedTicker",
			position: "bottom_bar",
			config: {
				feeds: [
					{
						title: "New York Times",
						url: "https://rss.nytimes.com/services/xml/rss/nyt/HomePage.xml"
					}
				],
				showSourceTitle: true,
				showPublishDate: true,
				broadcastNewsFeeds: true,
				broadcastNewsUpdates: true
			}
		},

[sdetweil]

from my dropbox , screen video capture

https://www.dropbox.com/s/vab6t9j0oa95zyw/Kazam_screencast_00000.mp4?dl=0

[Cr4z33]

This post is deleted!

[Cr4z33]

This post is deleted!

[sdetweil]

I don’t understand. the default, the text ( the beginning of the line of text) starts to appear on the right side of the screen and scrolls to the left ( last showing the end of the line of text)

my change, per your request, the end of the text appears on the left of the screen, and scrolls to the right ( last showing the beginning of the line of text)

this is for left to right language English. I don’t know if language setting changes the default marquee order

[sdetweil]

@Cr4z33 did u see my post above?