displaying images in a slider

Question

I want to know is there an easy way in order to be able to place images in a loop as below in like a slider? The user sees first image in a slider and then by using arrows for example, be able to slide to next to next or previous image. If user is on last image and wants to go on next image, it displays the first image again. if user is on first image and click on previous, it goes on last image. So it stays continuous.

Below is code where if there are no images then it displays a blank but if there are images, then displays those images in a slider:

<?php
        //start:procedure image
        $img_result = '';
        if(empty($arrImageFile[$key])){
          $img_result = '&nbsp;';
        }else{

?>


<?php foreach ($arrImageFile[$key] as $i) { ?>
<p><img alt="<?php echo $i; ?>" height="200" width="200" src="<?php echo 'ImageFiles/'.$i; ?>"></p>
<?php } ?>


<?php

        }
        //end:procedure image

There are many free sliders available that can do what you want. Try this. http://flexslider.woothemes.com/ — Jehanzeb.Malik, Feb 09 '13 at 22:18
if you want to create your own: http://stackoverflow.com/a/12608357/1428241 — Barlas Apaydin, Feb 09 '13 at 22:27

score 1 · Accepted Answer · answered Feb 10 '13 at 06:51

1

A basic jquery slider is easy to implement with instructions of you fancy it: http://basic-slider.com/

answered Feb 10 '13 at 06:51

user2048994

270
4
14

score 0 · Answer 2 · answered Feb 09 '13 at 22:20

0

Codrops is a nice site for front-end sollutions, I found this plugin that can maybe can help you, in this tutorial she teaches how to do it, and gives you a demo code too.

http://tympanus.net/codrops/2012/04/05/slideshow-with-jmpress-js/

Enjoy it!

answered Feb 09 '13 at 22:20

Eric Martins

460
4
17

displaying images in a slider

2 Answers2