So my project is to display each time one image from the Wordpress media library.

The WordPress page will display the newest image and also display a << next button that links to the next image.

The user will click that link and will see the next image and again and again until complete.

So I have the code below but I don't know how to make the next page to work, How to make the i var to increment by +1 since the page is refreshing after each NEXT and goes back to i=0

Thanks

<?php
    $args = get_posts(array(
        'post_type'         => 'attachment',
        'post_mime_type'    => 'image',
        'post_status'       => 'inherit',
    ));

    $images = array();

    foreach ( $args as $image) {
        $images[]= $image->ID;
    }

$i = 0;
?>

/* And the HTML is: */
<div id="START_BUTTON" align="center" style="display:none">
        <a href="<? php echo get_permalink( $images[i] ); ?>">START </a> 
</div>
<div id="NEXT_BUTTON" align="center" style="display:block">
        <a href="<? php echo get_permalink( $images[i+1] ); ?>">NEXT </a>
</div>