โฮมเพจ » ออกแบบเว็บไซต์ » 20 แกลลอรี่รูปภาพและสไลด์โชว์ที่ตอบสนอง (2018)

    20 แกลลอรี่รูปภาพและสไลด์โชว์ที่ตอบสนอง (2018)

    หากเว็บไซต์ของคุณเป็นภาพที่หนักหน่วงเช่นเว็บไซต์ผลงานหรือภาพถ่าย ฯลฯ มีสองสิ่งที่คุณต้องการมากที่สุด - ปลั๊กอินแกลเลอรี่รูปภาพเพื่อช่วยคุณ จัดการรูปภาพบนเว็บไซต์ของคุณได้ดียิ่งขึ้น, และสไลด์โชว์ภาพเพื่อแสดงภาพของคุณไปทั่วโลก.

    โพสต์ของฉันในวันนี้ แต่ส่วนใหญ่จะกล่าวถึงรายการแกลเลอรี่ภาพที่ตอบสนองและสไลด์โชว์ แกลเลอรี่และสไลด์โชว์เหล่านี้ได้รับการออกแบบในสไตล์ที่แตกต่างและมาพร้อมกับ คุณสมบัติต่างๆสำหรับเบราว์เซอร์ที่ดีที่สุดและการรับชมผ่านมือถือ. มาดูรายละเอียดคุณสมบัติของแต่ละรายการกัน.

    WOW Slider

    WOW Slider เป็น แถบเลื่อนรูปภาพที่ใช้ jQuery ที่มาพร้อมกับเอฟเฟ็กต์ภาพที่น่าทึ่งและช่วยให้คุณสร้างตัวเลื่อนด้วยการคลิกเพียงไม่กี่ครั้ง คุณสามารถฝังได้อย่างรวดเร็วทุกที่ขอบคุณมัน 'ตัวช่วยสร้างการแทรกหน้า' และตัวเลือกบันทึกเป็นปลั๊กอินสำหรับ Joomla และ WordPress.

    นอกจากนี้ยังมีชุดรูปแบบที่ออกแบบไว้ล่วงหน้าจำนวนมากคุณสมบัตินำเข้าและส่งออกและรวมถึง no-jQuery, CSS-fallback อย่างเดียว เช่นกัน.

    สวัสดี Slider

    Hi Slider ช่วยสร้างแถบเลื่อนภาพที่ไม่มีการเข้ารหัส มันมีชุดรูปแบบที่สวยงามและลักษณะพิเศษการเปลี่ยนแปลงพร้อมกับ รองรับการออกแบบเทมเพลตที่กำหนดเอง. น่าอัศจรรย์มันช่วยคุณในการเผยแพร่แถบเลื่อนของคุณและสร้าง HTML หรือโมดูลสำหรับ WordPress, Drupal และ Joomla.

    สุดท้ายคุณสามารถเพิ่มมัลติมีเดียจากหลายแหล่งรวมถึง YouTube.

    Jssor Slider

    Jssor Slider เป็นเนื้อหาที่น่าสนใจและตัวเลื่อนภาพด้วย เอฟเฟกต์การเปลี่ยนแปลงมากกว่า 300 รายการ. มันมีทั้งแถบเลื่อน jQuery และ no-jQuery และปลั๊กอินสำหรับ WordPress เช่นกัน สิ่งที่ฉันชอบคือมัน ให้การสาธิตและตัวอย่างมากมาย, ซึ่งจะช่วยให้ทุกคนสามารถเริ่มต้นใช้งานได้อย่างรวดเร็วด้วยโซลูชันตัวเลื่อนนี้.

    อย่างไรก็ตามมัน ไม่รองรับแพลตฟอร์มการเผยแพร่จำนวนมาก หรือบริการเนื้อหาเช่น Flickr และ YouTube เช่นเดียวกับโซลูชันด้านบน.

    กล่องน้ำผลไม้

    Juicebox เป็นผู้สร้างแกลเลอรี่รูปภาพที่น่าทึ่งซึ่งช่วยให้คุณสร้างแกลเลอรีเว็บโดยไม่ต้องมีการเข้ารหัส หากคุณไม่ต้องการ HTML คุณสามารถติดตั้งและใช้หนึ่งในนั้นได้ ปลั๊กอินสำหรับ WordPress, Lightroom, Photoshop, และอื่น ๆ.

    มันมาพร้อมกับไอคอนเวกเตอร์การสนับสนุน Flickr ฯลฯ และมีคุณสมบัติอื่น ๆ อีกมากมายในรุ่นโปรเช่น ตัวเลือกการแบ่งปันทางสังคมการสนับสนุนตะกร้าสินค้าการสนับสนุนเพลง, ชุดรูปแบบขั้นสูง ฯลฯ.

    cssSlider

    cssSlider เป็น CSS บริสุทธิ์, เช่น., no-jQuery, ตัวเลื่อนแบบไม่มี JavaScript สารละลาย. มันมีเอฟเฟ็กต์ภาพเคลื่อนไหวและคุณสมบัติการแก้ไขภาพมากมาย คุณสามารถเลือกจากชุดสีสำเร็จรูปเพื่อสร้างแถบเลื่อนรูปภาพที่มีน้ำหนักเบา.

    ยิ่งกว่านั้นคุณสมบัติสไลด์โชว์ของมันรวมถึง การสนับสนุนแบบเต็มความกว้างตัวเลือกเล่นอัตโนมัติการนำทาง และการสนับสนุนรูปขนาดย่อ ฯลฯ.

    Cincopa

    Cincopa เป็นโซลูชั่นคล้ายคลาวด์เพื่อสร้างสไลด์โชว์โดยใช้ตัวช่วยสร้างสไลด์โชว์ที่เรียบง่าย มันคือ โซลูชันออนไลน์พร้อมพื้นที่เก็บข้อมูลไม่ จำกัด และเข้ากันได้กับหลายแพลตฟอร์มเช่น Joomla และ WordPress ที่น่าสนใจคุณสามารถ เพิ่มเพลงและฝังวิดีโอลงในแถบเลื่อนของคุณ.

    สุดท้ายนี้ยังมีเทมเพลตจำนวนมาก (เช่นกริด, นิตยสาร, พอร์ตโฟลิโอ ฯลฯ ) และการสนับสนุนเพื่อรวม Google Analytics ไว้ด้วย.

    Slider ที่น่าตื่นตาตื่นใจ

    Amazing Slider เป็นตัวเลื่อน jQuery ด้วย รองรับวิดีโอจาก YouTube. คุณสามารถสร้างแถบเลื่อนใน HTML เพื่อฝังไว้ในหน้าเว็บหรือใช้แบบเดียวกันในโปรแกรมแก้ไขเช่น Dreamweaver หรือ Frontpage นอกจากนี้คุณยังสามารถสร้างปลั๊กอินหรือโมดูลสำหรับ Joomla และ WordPress.

    สุดท้ายมัน ส่วนต่อประสานผู้ใช้ที่ใช้งานง่ายด้วยตัวช่วยสร้างตัวเลื่อน ช่วยคุณสร้างแถบเลื่อนที่ยอดเยี่ยมด้วยสกินที่สร้างไว้ล่วงหน้าและเอฟเฟกต์การเปลี่ยนแปลงหลายอย่างในเวลาต่ำสุด.

    Bootstrap คลังภาพ

    Bootstrap Gallery เป็นผู้สร้างแกลเลอรีที่เรียบง่ายฟรีสำหรับการใช้งานส่วนบุคคลและเชิงพาณิชย์รวมถึงตารางรูปแบบการก่ออิฐและ modal Lightbox สิ่งที่ฉันสนใจคือคุณทำได้ เพิ่มแท็กในคลังภาพของคุณ พร้อมด้วยการสนับสนุนภาพถ่ายและวิดีโอ.

    นอกจากนี้ยังมีตัวเลือกการปรับแต่งมากมายรวมถึงตัวเลือกให้ เปลี่ยนสีและชื่อ ฯลฯ.

    แกลเลอเรีย

    แกลเลอเรียคือ เฟรมเวิร์กคลังภาพที่ใช้ JavaScript. น่าอัศจรรย์คุณสามารถฝังภาพถ่ายและวิดีโอจาก Flickr, Vimeo และ YouTube ด้วยโค้ดเพียงไม่กี่บรรทัด มันให้ ธีมฟรีมากมายและปลั๊กอินที่ไม่เป็นทางการสำหรับ WordPress เช่นกัน.

    อย่างไรก็ตามมันไม่ได้ใช้งานง่ายเหมือนโซลูชันด้านบนและต้องใช้การจัดการซอร์สโค้ด.

    นินจาสไลเดอร์

    Ninja Slider เป็นโซลูชั่นการนำเสนอภาพนิ่งภาพด้วย รองรับ HTML. จะช่วยให้การฝังเสียงและวิดีโอพื้นเมืองและวิดีโอจาก YouTube และ Vimeo เช่นกัน Ninja Slider ไม่ต้องการ jQuery และรองรับ คุณสมบัติการโหลดขี้เกียจ, ซึ่งจะดาวน์โหลดรูปภาพในพื้นหลังเมื่อผู้ใช้เลื่อนพอที่จะดูได้.

    ยิ่งกว่านั้นมันยัง อนุญาตข้อความในแถบเลื่อน, และคุณสามารถปรับแต่งรูปลักษณ์และความรู้สึกด้วย CSS.

    Slider Maker

    Slider Maker เป็นผู้สร้างสไลด์โชว์ jQuery ที่ต้องการการเข้ารหัสเป็นศูนย์ มีหลายภาษาและ รองรับหลายเลเยอร์ที่มีเส้นเวลาในรูปภาพเดียว. นอกจากนี้ยังใช้ประโยชน์จากสมาร์ทโหลดแบบสันหลังยาวและเอฟเฟกต์การเปลี่ยนแปลงต่างๆเพื่อสร้างตัวเลื่อนที่น่าทึ่งและนำเสนอธีมมากมาย.

    นอกจากนี้คุณยังสามารถ รวมไว้ในแผงผู้ดูแลระบบใด ๆ, อย่างไรก็ตามมันเป็นวิธีการชำระเงิน.

    SlideAwesome

    SlideAwesome เป็นผู้สร้างสไลด์โชว์ภาพถ่ายที่ต้องการ ไม่มีความรู้การเข้ารหัส. มันทำงานได้กับ CMSs ส่วนใหญ่รวมถึง WordPress, Drupal และอื่น ๆ แม้ว่าจะมี ไม่มีปลั๊กอินอย่างเป็นทางการ สำหรับพวกเขาและคุณต้องฝังรหัส.

    น่าแปลกที่คุณสามารถรวมวิดีโอจาก Vimeo และ YouTube ในแถบเลื่อนของคุณ นอกจากนี้ยังมี โหมดซ่อนตัว ที่ช่วยให้คุณสามารถดูตัวอย่างสไลด์โชว์บนไซต์สดของคุณโดยไม่แสดงให้ผู้เยี่ยมชมเห็น.

    PhotoSnack

    PhotoSnack เป็นผู้สร้างสไลด์โชว์ภาพถ่ายออนไลน์ที่รองรับการอัพโหลดภาพถ่าย บริการเก็บภาพถ่ายและโซเชียลมีเดีย เช่น Google Photos, Facebook, Instagram และอื่น ๆ หลังจากสร้างสไลด์โชว์คุณสามารถใช้งานได้โดยการฝังโค้ด (การคัดลอกวาง) ลงในบล็อกหรือเว็บไซต์ของคุณ.

    นอกจากนี้คุณสามารถเลือกสไตล์จากมัน ชุดแม่แบบ และแบ่งปันสไลด์โชว์โดยตรงกับเพื่อน ๆ ในโซเชียลมีเดียของคุณในไม่กี่คลิก.

    Flickr ฝัง

    Flickr ฝังเป็นเครื่องมือสร้างรหัสเพื่อ สร้างสไลด์โชว์จากภาพถ่าย Flickr, ซึ่งคุณสามารถฝังในเว็บไซต์ของคุณในภายหลัง สิ่งที่ฉันชอบคือมันช่วยให้ดึงภาพจากหลากหลายแหล่งรวมถึงผู้ใช้หรือกลุ่ม มันมีรายการตัวเลือกและสร้างสไลด์โชว์โดยใช้ตัวเลือกที่เลือก.

    คุณสามารถคัดลอกและวาง JavaScript ที่ทันสมัยหรือรหัส iFrame ดั้งเดิม ไปยังเว็บไซต์ของคุณเพื่อแสดงสไลด์โชว์ใหม่ของคุณ.

    comSlider

    comSlider เป็นผู้สร้างสไลด์โชว์ออนไลน์ที่ให้บริการ การเปลี่ยนแฟนซีและเอฟเฟ็กต์ภาพ. แม้ว่าอินเทอร์เฟซของมันอาจไม่สร้างความประทับใจให้คุณ แต่มันก็มีฟีเจอร์ไม่น้อยไปกว่ากัน มันมีตัวเลือกมากมายในการปรับแต่งรูปลักษณ์ของแถบเลื่อนพร้อมกับตัวเลือกขั้นสูงบางอย่างเช่น ตัวบ่งชี้การโหลด, ฯลฯ.

    สุดท้าย แต่ไม่ท้ายสุดคุณสามารถรวมเข้ากับเว็บเพจใด ๆ ได้ง่ายๆโดยการคัดลอกโค้ดของมันเหมือนกับ Flickr ฝัง.

    Image Slider Maker

    Image Slide Maker เป็น ผู้ผลิตตัวเลื่อนที่ทำงานออนไลน์ทั้งหมด. มันขึ้นอยู่กับ jQuery เช่นเดียวกับ comSlider และช่วยให้คุณสร้างสไลด์เนื้อหาที่มีข้อความลิงค์ภาพถ่ายและ ผลกระทบภาพเคลื่อนไหว. คุณสามารถปรับแต่งคุณสมบัติของมันรวมถึงองค์ประกอบการออกแบบเช่นปุ่มและขนาดการเปลี่ยนสไลด์ตัวอักษรและรูปแบบข้อความ ฯลฯ.

    PgwSlider

    PgwSlider เป็น ตัวเลื่อนไลบรารีสำหรับ jQuery และ Zepto, ซึ่งสามารถใช้ในการสร้างตัวเลื่อนภาพ แม้ว่ามันจะไม่ได้ใช้งานง่ายเหมือนโซลูชันบางอย่างที่กล่าวมา แต่มันก็ทำงานได้อย่างไร้ที่ติและคุณสามารถทำให้มันทำงานได้ด้วยการเข้ารหัสเล็กน้อย เว็บไซต์ให้รายละเอียดเกี่ยวกับ ตัวเลือกรูปลักษณ์และความรู้สึกและแสดงการสาธิต ตัวอย่างเพื่อช่วยให้คุณเริ่มต้นได้อย่างรวดเร็ว.

    jQuery Gridder

    jQuery Gridder เป็นปลั๊กอิน jQuery เพื่อสร้างคลังภาพ จะแสดงตารางรูปขนาดย่อของภาพด้วย ดูตัวอย่างภาพขยายที่สวยงาม, คล้ายกับ Google Images.

    อย่างไรก็ตามเช่นเดียวกับ PgwSlider ต้องมีการเข้ารหัสในส่วนของคุณ มีตัวเลือกการกำหนดค่าบางอย่างพร้อมกับตัวเลือกที่จะรวม โทรกลับสำหรับกิจกรรมต่างๆ.

    SlidesJS

    SlideJS คือ ปลั๊กอินสไลด์โชว์สำหรับ jQuery. มันมีการเปลี่ยนที่ราบรื่นและตัวเลือกการกำหนดค่ามากมาย แต่ SlideJS ต้องการให้คุณมีประสบการณ์การเขียนโปรแกรม สิ่งที่ฉันชอบคือ jQuery Gridder คุณสามารถเพิ่มฟังก์ชั่นการโทรกลับเพื่อทำอะไรบางอย่างได้ เหตุการณ์ต่าง ๆ ของสไลด์โชว์, เช่นเมื่อสไลด์โหลดเริ่มต้นหรือเสร็จสิ้น.

    หวด

    wallop เป็นไลบรารีตัวเลื่อนที่ทำงานได้ดีที่สุดสำหรับการแสดงและซ่อนสิ่งต่าง ๆ การใช้ไลบรารี่เล็ก ๆ ที่มีประโยชน์นี้คุณสามารถสร้างสไลด์เดอร์รูปภาพรวมถึงการแบ่งหน้าแบบกำหนดเองได้ด้วย ฟังเหตุการณ์.

    สุดท้ายมันมีรายการของการเปลี่ยนแปลงและตัวเลือกเช่นเดียวกับ ชุด API เพื่อควบคุมและปรับแต่งแถบเลื่อนรูปภาพของคุณ หรือการสร้างอื่น ๆ.