【JS部分】
<script type="text/javascript" src="../js/jquery.js"></script>
<script type="text/javascript" src="../js/jquery.cycle.all.pack.js"></script>
<script type="text/javascript">
$(function() {$('.sample').cycle({
fx:'shuffle',
delay: -2000
});});
【CSS部分】
.sample{
width:250px;
height:188px;
padding:0;
margin:20px auto;
}
.sample img{
top:0;
left:0;
background:#fff;
padding:10px;
border:1px solid #999;
}
【html部分】
<ul class="sample">
<li><img src="img/sample1.jpg" alt="サンプル写真" width="250" height="188" /></li>
<li><img src="img/sample2.jpg" alt="サンプル写真" width="250" height="188" /></li>
<li><img src="img/sample3.jpg" alt="サンプル写真" width="250" height="188" /></li>
<li><img src="img/sample4.jpg" alt="サンプル写真" width="250" height="188" /></li>
<li><img src="img/sample5.jpg" alt="サンプル写真" width="250" height="188" /></li>
</ul>