1

I'm looking to create a way to navigate to the next/previous image in an entry's asset range and display only the current asset at one time(starting from first asset).

{% extends '_layout.html' %}

{% block main %}


<div class="tr">
    {{ entry.title }}
  </div>

  <div class="row nav">
        <a href="{{ siteUrl }}"><span class="name">Emily Ashcroft</span></a>

    <a class="head" href="{{ siteUrl }}comm.html">Commissions</a>
    <a class="head" href="{{ siteUrl }}port.html">Portraits</a>
    <a class="head" href="{{ siteUrl }}pers.html">Personal</a>
    <a class="head" href="{{ siteUrl }}CV.html">Info</a>

    </div>


<!-- left side of window links to previous image if there is one, right side links to next image or asset if there is on -->

<a href="{{ siteUrl }}"><div class="left"></div></a>

<a href="{{ siteUrl }}"><div class="right"></div></a>

<div class="container">

<!-- output current asset only -->

        {% for photo in entry.photos %}
  <div class="row">
      <div class="centre">
         <img id="slider" src="{{ photo.first.getUrl() }}" />
      </div>
  </div>

  {% endfor %}

  </div>
{% endblock %}

Click on left side of screen and the previous asset is displayed, click on the right and the next asset is output. I'm struggling to figure if I should use a method similar to paginating links to next/prev entries (but I don't think that would work for assets).

This code is taken from _entry.html page of a section.

Thanks for any help provided.

1

Given that your assets are within an entry, it seems that a gallery browsing mechanism may fit well. I'd suggest a javascript framework such as Fancybox: http://fancyapps.com/fancybox/

Alternatively and perhaps more in line with your specific question, have a look at this related thread: Best way to access getPrev and getNext asset fields

| improve this answer | |

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.