รวมสื่อ/นวัตกรรมทางการศึกษา

สื่อ/นวัตกรรม >> การแสดง Slide Show ในหน้า Home

โค้ดตัวอย่างการแสดง Slide Show ในหน้าเว็บ เริ่มต้นด้วยการสร้างส่วนเสริมใหม่ และใส่โค้ดด้านล่างลงในกรอบ รายละเอียด


<id="slideshow widget" class="slideshow"></div>
<script>
varslideshow = new gBanner ("slideshow");
slideshow.add ('http://www.siamlearning.org/upload/slideshow/1.jpg', '', 'http://www.siamlearning.org')
slideshow.add ('http://www.siamlearning.org/upload/slideshow/2.jpg', '', 'http://www.siamlearning.org')
slideshow.add ('http://www.siamlearning.org/upload/slideshow/3.jpg', '', 'http://www.siamlearning.org')
slideshow.playSlideShow();
</script>
ผมแนะนำให้ใส่โค้ดลงใน Editor ภายใต้โหมด ดูรหัส HTML นะครับ
จากตัวอย่าง Javascript จะทำการโหลดรูปภาพที่จะแสดงจาก URL ที่กำหนด ด้วยคำสั่งด้านล่าง

slideshow.add ('Image URL', 'Image Detail', 'Link');
  • Image URL จะระบุไปยัง URL ของรูปภาพที่จะแสดงใน Slide Show ซึ่งสามารถอัปโหลดลงบนเว็บไซต์นี้ หรือ จากที่อื่นก็ได้
  • Image Detail ถ้ากำหนดค่าลงไป Slide Show จะแสดงข้อความด้านล่างของรูปภาพที่กำลังแสดงผล
  • Link สำหรับกำหนด URL ที่ต้องการหากมีการคลิกที่รูปภาพบน Slide Show
คุณสามารถที่จะอัปโหลดรูปภาพ Slideshow ผ่านทาง CKEditor ได้ และนำ URL ของรูปภาพที่ได้มากำหนดให้ คำสั่งตามด้านบน

สำหรับเว็บไซต์หลัก Slideshow ได้ถูกติดตั้งแล้ว ลงบน skin/0/index.html การแก้ไขต้องทำที่ไฟล์ดังกล่าวโดยตรง และ รูปภาพต่างๆที่จะแสดงใน Slideshow จะต้องอัปโหลดไปไว้ที่โฟลเดอร์ upload/slideshow/ ในชื่อ 1.jpg,2.jpg และ 3.jpg

01 กค. 2565 เวลา 16:35 น. 0 1532
^