ไม่ทราบว่าผมต้องแก้ไข ตำแหน่งไหนบ้าง ที่ต้องการให้ slide รูปจากตำแหน่ง filder ทั้งหมด ไปเรื่อยๆ
code
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "
http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd ">
<html xmlns="
http://www.w3.org/1999/xhtml ">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=tis-620">
<title>ทำภาพ SLIDE ด้วย JQuery Slide Viewer</title>
<STYLE type=text/css>
A:link { color: #0000cc; text-decoration:none}
A:visited {color: #0000cc; text-decoration: none}
A:hover {color: red; text-decoration: none}
</STYLE>
<style type="text/css">
<!--
small { font-family: Arial, Helvetica, sans-serif; font-size: 8pt; }
input, textarea,select { font-family: Arial, Helvetica, sans-serif; font-size: 11pt; }
b { font-family: Arial, Helvetica, sans-serif; font-size: 11pt; }
big { font-family: Arial, Helvetica, sans-serif; font-size: 15pt; }
strong { font-family: Arial, Helvetica, sans-serif; font-size: 11pt; font-weight : extra-bold; }
font, td { font-family: Arial, Helvetica, sans-serif; font-size: 12pt; }
BODY { font-size: 12pt; font-family: Arial, Helvetica, sans-serif; }
-->
</style>
<script src="js/jquery-1.5.min.js" type="text/javascript"></script>
<script src="js/jquery.easing.1.3.js" type="text/javascript"></script>
<script src="js/jquery.slideviewer.1.2.js" type="text/javascript"></script>
<style>
/*preload classes*/
.svw {width: 50px; height: 20px; background: #fff;}
.svw ul {position: relative; left: -999em;}
/*core classes*/
.stripViewer {
position: relative;
overflow: hidden;
border: 5px solid #ff0000;
margin: 0 0 1px 0;
}
.stripViewer ul { /* this is your UL of images */
margin: 0;
padding: 0;
position: relative;
left: 0;
top: 0;
width: 1%;
list-style-type: none;
}
.stripViewer ul li {
float:left;
}
.stripTransmitter {
overflow: auto;
width: 1%;
}
.stripTransmitter ul {
margin: 0;
padding: 0;
position: relative;
list-style-type: none;
}
.stripTransmitter ul li{
width: 20px;
float:left;
margin: 0 1px 1px 0;
}
.stripTransmitter a{
font: bold 10px Verdana, Arial;
text-align: center;
line-height: 22px;
background: #ff0000;
color: #fff;
text-decoration: none;
display: block;
}
.stripTransmitter a:hover, a.current{
background: #fff;
color: #ff0000;
}
/*tooltips formatting*/
.tooltip
{
padding: 0.5em;
background: #fff;
color: #000;
border: 5px solid #dedede;
}
</style>
</head>
<body>
<center>
<br><br>
<div id="mygalone" class="svw">
<ul>
<li><a href="
http://www.thamwebsite.com " target="_blank"><img alt="Picture 1" src="slide_picture/1.jpg" border="0" /></a></li>
<li><a href="
http://www.stickerlinethai.com " target="_blank"><img alt="Picture 2" src="slide_picture/2.jpg" border="0" /></a></li>
<li><a href="
http://www.codetukyang.com " target="_blank"><img alt="Picture 3" src="slide_picture/3.jpg" border="0" /></a></li>
<li><a href="
http://www.thamwebsite.com " target="_blank"><img alt="Picture 4" src="slide_picture/4.jpg" border="0" /></a></li>
<li><a href="
http://www.thamwebsite.com " target="_blank"><img alt="Picture 5" src="slide_picture/5.jpg" border="0" /></a></li>
</ul>
</div>
<script type="text/javascript">
var theLinks;
var nCount = 0;
var theTimerID;
function init(){
$("div#mygalone").slideView();
theLinks = jQuery('#stripTransmitter0 a'); //for kill interval purposes
theTimerID = setInterval("autoSlide()", 5000);
}
function autoSlide(){
jQuery.each(theLinks, function(i){
if(jQuery(this).hasClass('current')){
jQuery(theLinks[((i 1 < theLinks.length) ? (i 1) : 0)] ).trigger("click"); return false; } });
}
$(window).bind("load", init );
</script>
</center>
<br>
<center>
<hr width="90%"><br>
พัฒนาโดย : <a href="
http://www.gcmingati.net/wordp...gestrip/imageslide-plugin.html " target="_blank">
http://www.gcmingati.net </a>
<br><br>
<br><br><hr width="90%">
</center>
</body>
</html>