Dynamic Slideshow from Foreach loop

Question

I'm currently working on a digital signage project for my work and most of the back end stuff is done. However, a crucial issue that I've run into is how to display my output from my query into a slideshow format. Currently all the output is just dumped on the site as an array of images. I've been trying to find out how to utilize jquery with this issue but I'm not very strong in that area and not sure how to implement it correctly. Any assistance would be greatly appreciated!

I have some query code that I'm omitting but as far as where I'm stuck, this is all I have for output...

<?php

$show = array();

foreach ($rows as $k=>$v) {
    $show[] = '<img src="https://cdn.centralgatech.edu/digitalSignageImages/thumbs.php?file='.$v['content_name'].'" class="img-responsive" width="100%" alt="'.$v['content_desc'].'" height="100%">';
}

print_r($show);

?>

Answer 1

Generally you have to make $.get() ajax call and then insert html retrived from backend in your DOM using append jQuery method.

Let's say your backend returns something like <h1>Hello world</h1> on calling http://your-domain.com/get-h1

Now you just have to call it from javascript like

$.get(http://your-domain.com/get-h1, function(response) {
     $('.your-element').append(response);
});

and your greating will appear on page.