Read All Images from a folder And display slide show.

  • Download Gist
call jquery slide show method
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18
<script src="http://code.jquery.com/jquery-latest.js" type="text/javascript"></script>
<script src="jquery.innerfade.js" type="text/javascript"></script>
<script>
$(document).ready(function() {
$('#image_rotate').innerfade({
speed: 'slow',
timeout: 2000,
type: 'sequence',
containerheight: '220px'
});
});
</script>
 
 
<ul id="image_rotate" style="list-style: none;">
<?= $image_rotation; ?>
</ul>
read imges
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21
<?
// Global Variables
$image_dir = "$_SERVER[DOCUMENT_ROOT]/bdexchange/assets/slide"; // directory on server
$image_relative_path = 'assets/slide'; // path to images relative to script
$file_types = array('jpg', 'jpeg', 'gif', 'png');
$image_time = '4000'; // seconds each image will display (4000 = 4 seconds)
$image_rotation ='';
if ($handle = opendir($image_dir)) {
while (false !== ($file = readdir($handle))) {
if ($file != "." && $file != "..") {
$ext_bits = explode(".", $file); // finds file extensions
foreach ($ext_bits as $key => $value) {
if (in_array($value, $file_types)) {
$image_rotation .= '<li><img src="' .base_url().$image_relative_path . '/' . $file . '"></li>';
}
}
}
}
closedir($handle);
}
?>
source&demo
1
http://medienfreunde.com/lab/innerfade/
sourcedemo
1
http://medienfreunde.com/lab/innerfade/

Please sign in to comment on this gist.

Something went wrong with that request. Please try again.