<div class="scrollable"> <div class="items"> <div><img src="backshop/images_product/1.jpg" width="150" height="150" /></div> <div><img src="backshop/images_product/2.jpg" width="150" height="150" /></div> <div><img src="backshop/images_product/3.jpg" width="150" height="150" /></div> <div><img src="backshop/images_product/4.jpg" width="150" height="150" /></div> <div><img src="backshop/images_product/5.jpg" width="150" height="150"/></div> <div><img src="backshop/images_product/6.jpg" width="150" height="150"/></div> <div><img src="backshop/images_product/7.jpg" width="150" height="150" /></div> <div><img src="backshop/images_product/8.jpg" width="150" height="150" /></div> </div> </div> <br /> <script type="text/javascript"> // Javascript ที่ต้องการ $(function() { // ทำให้ id scrollable สั่งให้มีการ slide $("div.scrollable").scrollable({ // เลื่อนอัตโนมัติภายใน 2 วินาที interval: 2000, // สั่งให้วนลูปอัตโนมัติ loop: true, // ทำให้ animation มีการหน่วงเล็กน้อย 0.6 วินาที speed: 600, // ก่อนเริ่ม slide ทำให้ไอเทมมีการ tranparency เล็กน้อย onBeforeSeek: function() { this.getItems().fadeTo(300, 0.2); }, // หลังเื่ลื่อนสไลด์ ทำให้ไอเทมมีการ tranparency เล็กน้อย onSeek: function() { this.getItems().fadeTo(300, 1); } }); }); </script>
<div class="scrollable"> <div class="items"> <div><img src="<? echo'$image'?>" width="150" height="150" /></div> </div></div>
เพื่อความปลอดภัยของเว็บบอร์ด ไม่อนุญาติให้แทรก แท็ก [img]....[/img] โดยการอัพโหลดไฟล์รูปจากที่อื่น เช่นเว็บไซต์ ฟรีอัพโหลดต่าง ๆ อัพโหลดแทรกรูปภาพ ให้ใช้บริการอัพโหลดไฟล์ของไทยครีเอท และตัดรูปภาพให้พอดีกับสกรีน เพื่อความโหลดเร็วและไฟล์ไม่ถูกลบทิ้ง