->images->url() not showing

The CMS Questions
1

I’ve written some code that shows images randomly placed on a hover. Currently I can get an image to display when I use the code <?= $project->images()->first()->url() ?> but when I want to get more than one image to be displayed when I use the code <?= $project->images()->last()->url() ?> no images seem to show.

The html code in full is:

    <?php foreach($projects as $project): ?>
      <div class="film-contents-item-image" data-slug="<?php echo str::slug($project->title()->value)?>">
        <img src="<?= $project->images()->url() ?>" alt="Thumbnail for <?= $project->title()->html() ?>" data-slug="<?php echo str::slug($project->title()->value)?>" class="film-thumbnails-hidden" />
      </div>
    <?php endforeach ?>

Jquery:

var T = e(".film-contents-item"),
    I = e(".film-contents-item-image");

  T.find("a").hover(function() {
    var t = e(this).parent().attr("data-slug")
      , i = Math.floor(3 * Math.random()) + 1;
    I.find("img[data-slug=" + t + "]:lt(" + i + ")").removeClass("film-thumbnails-hidden"),
    I.find("img[data-slug=" + t + "]:lt(" + i + ")").addClass("film-thumbnails-visible")
  },
  function() {
    function i() {
      e(".film-contents-item-image[data-slug=" + s + "]").randomizer({
        randomSize: !1,
        repeat: !1
      })
    }
    var s = e(this).parent().attr("data-slug");
    I.find("img[data-slug=" + s + "]").removeClass("film-thumbnails-visible"),
    I.find("img[data-slug=" + s + "]").addClass("film-thumbnails-hidden"),
    t.setTimeout(i, 310)
  })
});
1 Like
2

This is not valid code. $page->images() returns a collection, not a single image. But the url method can be used only on a single file, not a collection.

3

Thanks for the quick reply. How could I got about returning the url of each image in a collection? Should I do another for each loop for the images within that page?

4

Yes, to output every image in the collection, you need another foreach loop.

1 Like