Прошу вас, пожалуйста, со мной на секунду. Я сделаю все возможное, чтобы объяснить как можно проще.
Я пытаюсь отображать созданные пользователем изображения в представлении photos.index с использованием Laravel 4. Как вы можете видеть ниже, я использую foreach для просмотра этих изображений. Тем не менее, поскольку я хочу, чтобы они отображались в коробках высотой 300px и шириной 300px, я использую метод «css» для фона css в моем классе «box».
Теперь я могу использовать JS для изменения фонового изображения каждого окна в соответствии с тем, что вставлено в базу данных.
Следующий код дает мне следующий результат: в моей базе данных отображается столько же ящиков, сколько и у меня. Тем не менее, все они имеют одинаковую картину, точнее изображение, которое является последним в базе данных.
@foreach(array_chunk($photos->getCollection()->all(), 4) as $row) <div class="row"> @foreach($row as $photo) <script type="text/javascript"> $(function(){ var boxes = document.getElementsByClassName("box"); $(boxes).css('background-image', 'url({{ url('img/user_images/images/'. $photo->source_name) }} )'); }); <article class="col-md-3"> <a href="{{ url('photos/'. $photo->id) }}"><div id="imagecontainer" class="box"></div></a> </article> @endforeach </div> @endforeach
Теперь мой вопрос: что мне нужно сделать, чтобы изменить фоновое изображение для каждого окна отдельно?
Возможно, важно знать, что те JavaScripts, которые я вижу, если я открываю сайт с помощью инструментов разработчика, имеют правильную ссылку на изображение, которое должно отображаться. Тем не менее, фон CSS каждого div всегда является последним изображением в БД.
Любая помощь будет очень, очень ценится.
Благодаря!