fordev22.com รับพัฒนาระบบ รับพัฒนาเว็บแอพพลิเคชั่น รับพัฒนาเว็บไซต์ รับเขียนโปรแกรม สอนทำเว็บ สอนเขียนเว็บ สอนทำเว็บ php สอนBootstrap สอนทำเว็บราคาถูก รับทำเว็บไซต์ราคาถูก โปรเจ็คจบ ทำเว็บแบบง่าย ๆ สอนทำเว็บรองรับมือถือ สอนทำเว็บรองรับทุกอุปกรณ์ สอนคอมพิวเตอร์ html php css web app sql Bootstrap Mysql XAMPP

PHP+MySqli EP.36 PHP Slide Image Fancybox
เป็นการ นำ Slide มาใส่ในเว็บ เพื่อให้เว็บ
มีลูกเลนมากขึ้น

ระบบ ตระกร้าสินค้า แบบไม่สมัครสมาชิกสั่งซื้อได้

ระบบ ตระกร้าสินค้าแบบสมัครสมาชิก

ระบบ ตระกร้าสินค้า ADVANCE แจ้งเตือนชำระเงินผ่านไลน์

ระบบ เช่าชุดออนไลน์

ระบบ บริหารจัดการห้องพัก

Css (CDN)

<script src="https://cdn.jsdelivr.net/npm/jquery@3.5.1/dist/jquery.min.js"></script>

<link rel="stylesheet" href="https://cdn.jsdelivr.net/gh/fancyapps/fancybox@3.5.7/dist/jquery.fancybox.min.css" />
<script src="https://cdn.jsdelivr.net/gh/fancyapps/fancybox@3.5.7/dist/jquery.fancybox.min.js"></script>

Link img

<a data-fancybox="gallery" href="">
     <img src="" class="card-img-top" alt="...">
</a>

</a>

Custom

<script type="text/javascript">
      $('[data-fancybox]').fancybox({

        //loop: false,
        loop: true,
        buttons: [
            "zoom",
            //"share",
            "slideShow",
            //"fullScreen",
            //"download",
            "thumbs",
            "close"
        ],

        // Open/close animation type
        // Possible values:
        //   false            - disable
        //   "zoom"           - zoom images from/to thumbnail
        //   "fade"
        //   "zoom-in-out"
        //
        animationEffect: "zoom",

        // Transition effect between slides
        //
        // Possible values:
        //   false            - disable
        //   "fade'
        //   "slide'
        //   "circular'
        //   "tube'
        //   "zoom-in-out'
        //   "rotate'
        //
        transitionEffect: "slide",
      
      });
</script>

$('[data-fancybox]').fancybox({

//loop: false,

loop: true,

buttons: [

"zoom",

//"share",

"slideShow",

//"fullScreen",

//"download",

"thumbs",

"close"

// Open/close animation type

// Possible values:

// false - disable

// "zoom" - zoom images from/to thumbnail

// "fade"

// "zoom-in-out"

animationEffect: "zoom",

// Transition effect between slides

// Possible values:

// false - disable

// "fade'

// "slide'

// "circular'

// "tube'

// "zoom-in-out'

// "rotate'

transitionEffect: "slide",

});

</script>

ระบบ ตระกร้าสินค้า แบบไม่สมัครสมาชิกสั่งซื้อได้

ระบบ ตระกร้าสินค้าแบบสมัครสมาชิก

ระบบ ตระกร้าสินค้า ADVANCE แจ้งเตือนชำระเงินผ่านไลน์

ระบบ เช่าชุดออนไลน์

ระบบ บริหารจัดการห้องพัก

You might also like