html CSSБекграунд - безконечныйслайдервверх

Posted 2021-05-10

/**************************/
#Technology-slider .wrapper {
  overflow: hidden;
}

#Technology-slider .sliding-background {
  background: url("/wp-content/uploads/2019/06/Full_V3.jpg") repeat-x;
    height: 5676px;
    width: 100%;
/*     animation: slide 120s linear infinite; */
    animation: slide 120s linear infinite;
    background-size: contain;
}


#Technology-slider .sliding-background {
    background: url("/wp-content/uploads/2019/06/Full_V3.jpg") repeat-y;
    height: 5676px;
    width: 100%;
    animation: slide 120s linear infinite;
    background-size: contain;
}

/* Slide to top */
@keyframes slide {
    0% {
        transform: translate3d(0,0,0)
    }

    100% {
        transform: translate3d(0,-2292px,0)
    }
}

/* Slide to left
@keyframes slide{
  0%{
    transform: translate3d(0, 0, 0);
  }
  100%{
    transform: translate3d(-1692px, 0, 0);
  }
}
*/
#Technology-slider .elementor-widget-container.widget-area .wrapper {
    height: 400px;
}

@media screen and (max-width:768px){
	
#Technology-slider .elementor-widget-container.widget-area .wrapper {
    height: 200px;
}

}
/**************************/

<div id="Technology-slider">
  <div class="wrapper">
    <div class="sliding-background"></div>
  </div>
</div>