I have the following code, i use the php file to read contents of a folder put it into an array and then have a slideshow using Jquery Cycle plugin.
<html>
<meta http-equiv="refresh" content="1000"/>
head>
<title>Media Signage Slideshow</title>
<style type="text/css">
#myslides {
width: 370px;
height: 220px;
padding: 0;
margin: 0 auto;
}
</style>
</head>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js"></script>
<script type="text/javascript" src="http://cloud.github.com/downloads/malsup/cycle/jquery.cycle.all.latest.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$('#myslides').cycle({
fx: 'fade',
speed: 5000,
timeout: 2000
});
});
</script>
<script type="text/javascript">
var curimg=0;
function rotateimages(){
galleryarray.sort();
document.getElementById("myslides").setAttribute("src", "images/"+galleryarray[curimg]);
curimg = (curimg+1) % galleryarray.length;
}
window.onload = function(){
setInterval("rotateimages()", 5000);
}
/script>
<script type="text/javascript" language="JavaScript" src="./code.php"></script>
<body>
<div id="myslides">
<!--<img src="100.jpg" />
<img src="101.jpg" /> -->
</div>
</body>
</html>
when i change:
<div id="myslides">
to
<img id="myslides">
my slide show works fine but with div id i dont see anything. How to fix this?