Question

I am looking forward to build a page that displays a single image
what i want to achieve is that, on clicking a ‘next’ button, the image should be changed but the page shouldn’t be reloaded.

I am gonna be storing the images in a folder and the names would be random.
I have worked with php and a bit of javascript so i have the basic knowledge.

I googled the issue, some say use Ajax, some say use jquery. I am just unable to figure out what approach should i take.

Any help would really be appreciated

Answer 1

With JavaScript, just change the image’s source.

document.getElementById('image-id').src = 'new-image.png';