Я пытаюсь заставить эту галерею изображений бесконечно прокручиваться слева направо. Я пишу это в Ruby на Rails, и изображения поступают со стороны администратора, куда они загружаются.
Так что цикл работает нормально с кодом ниже, это означает, что когда-то последний изображение покинуло экран, его положение будет сброшено на -1500 с левого экрана, но как только я начну добавлять другие изображения, положение также должно увеличиться. Как заставить изображения покинуть и войти в экран в одном и том же положении, не меняя положение в функции каждый раз? Спасибо заранее, извините, если я что-то забыл, это мой первый пост здесь.
<div class="row">
<% @posts.each do |post| %>
<% if post.photo.attached? %>
<div class="photo-flow ml-2">
<%= cl_image_tag post.photo.key, class: " box", alt: 'photo'%>
</div>
<% end %>
<% end %>
</div>
const MAX_POSITION = 1500;
const boxes = document.querySelectorAll('.box');
let position = 0;
function animate() {
position += 2;
if (Math.abs(position) >= (
window.innerWidth || document.documentElement.clientWidth
)) {
position = -1500;
}
boxes.forEach(box => {
box.style.transform = `translateX(${position}px)`
});
}