[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 */