Jquery วงจร ปลั๊กอิน fx ตัวเลือก

ปลั๊กอินปลั๊กอิน jQuery ปลั๊กอินปลั๊กอิน jQuery เป็นปลั๊กอินสไลด์โชว์ที่มีน้ำหนักเบาการใช้งานจะขึ้นอยู่กับปลั๊กอิน InnerFade โดย Torsten Baldes ปลั๊กอินสไลด์โชว์โดย Matt Oakes และปลั๊กอิน jqShuffle โดย Benjamin Sterling สนับสนุนการหยุดชั่วคราวเมื่อเลื่อนอัตโนมัติ - หยุดอัตโนมัติพอดีก่อนที่จะโทรกลับคลิกทริกเกอร์และผลการเปลี่ยนแปลงมากมายนอกจากนี้ยังสนับสนุน แต่ไม่ต้องใช้เมตาดาต้าปลั๊กอินและปลั๊กอินปลั๊กอินวิธีการทำงานปลั๊กอินให้วิธีการที่เรียกว่าวัฏจักรซึ่งถูกเรียกใช้บนคอนเทนเนอร์ องค์ประกอบลูกแต่ละอันของคอนเทนเนอร์จะกลายเป็นสไลด์ตัวเลือกจะควบคุมวิธีการและเวลาที่สไลด์ถูกเปลี่ยนไป ScrollRight click. Images ใช้ในการสาธิตเหล่านี้เนื่องจากดูดี แต่สไลด์โชว์ไม่ จำกัด เฉพาะภาพคุณสามารถใช้องค์ประกอบใดก็ได้ที่คุณต้องการ Effects. Use หน้าเบราว์เซอร์ผลเพื่อดูตัวอย่างผลกระทบที่มีอยู่ดูการสาธิตเพิ่มเติมและตัวอย่างปลั๊กอิน Cycle มีตัวเลือกมากมายสำหรับการกำหนดค่าสไลด์โชว์ของคุณค่าดีฟอลต์ของตัวเลือกจะถูกครอบงำ den โดยการส่งออบเจกต์ตัวเลือกไปยังเมธอดวัฏจักรโดยใช้ metadata ในคอนเทนเนอร์ element หรือโดย redefining ค่าในโค้ดของคุณเองสำหรับข้อมูลเพิ่มเติมเกี่ยวกับตัวเลือกให้ดูที่หน้าอ้างอิงเกี่ยวกับตัวเลือกทำไมต้องใช้งานสไลด์โชว์อีกแบบหนึ่ง คุณลักษณะพิเศษเช่นหยุดชั่วคราวเมื่อเลื่อนอัตโนมัติพอดีหยุดสไลด์โชว์และใช้ปลั๊กอินเมตาดาต้าและเมื่อฉันเห็นปลั๊กอิน jqShuffle ของ Benjamin Sterling ฉันต้องการเพิ่มผลดังกล่าวเพื่อขอบคุณ Ben มากสำหรับให้ฉันทำเช่นนั้น ปลั๊กอิน jQuery Cycle ตรวจสอบ Cycle2 ล่าสุดในบรรทัด Cycling ของภาพสไลด์ปลั๊กอิน jQuery Cycle เป็นปลั๊กอินสไลด์โชว์ที่สนับสนุนหลายประเภทของการเปลี่ยนแปลงผลกระทบมันสนับสนุนหยุดชั่วคราวในรถอัตโนมัติหยุดอัตโนมัติพอดีก่อนหลังจาก callbacks คลิกทริกเกอร์และอื่น ๆ อีกมากมายนอกจากนี้ยังสนับสนุน แต่ไม่จำเป็นต้องปลั๊กอินปลั๊กอินวิธีการทำงานปลั๊กอินให้วิธีการที่เรียกว่าวัฏจักรซึ่งเรียกใช้ในองค์ประกอบคอนเทนเนอร์องค์ประกอบลูกแต่ละอันของคอนเทนเนอร์จะกลายเป็นสไลด์ตัวเลือก เมื่อภาพนิ่งเปลี่ยนไป ScrollRight click. Images ใช้ในการสาธิตเหล่านี้เพราะดูดี แต่ภาพสไลด์ไม่ จำกัด เฉพาะภาพคุณสามารถใช้องค์ประกอบใด ๆ ที่คุณต้องการได้ผลใช้เอฟเฟ็กต์เบราว์เซอร์เพื่อดูตัวอย่างที่ใช้ได้ ดูตัวอย่างเพิ่มเติมและตัวอย่างปลั๊กอิน Cycle มีตัวเลือกมากมายสำหรับการปรับแต่งสไลด์โชว์ของคุณค่าดีฟอลต์ของค่าอ็อบเจ็กต์สามารถถูกทับได้โดยการส่งวัตถุตัวเลือกไปยังเมธอดวัฏจักรโดยใช้เมตาดาต้าบนคอนเทนเนอร์องค์ประกอบหรือโดยการกำหนดค่าใหม่ในค่าของคุณ สำหรับข้อมูลเพิ่มเติมเกี่ยวกับตัวเลือกให้ดูที่หน้าอ้างอิงเกี่ยวกับตัวเลือกพิเศษขอบคุณ Torsten Baldes Matt Oakes และ Ben Sterling สำหรับความคิดมากมายที่ทำให้ฉันเริ่มต้นเขียน Cycle ในปี 2007 การสาธิตนี้อธิบายวิธีการที่ง่ายในการใช้ jQuery Cycle ตัวเลือกและบางส่วนของที่ดีที่สุดของ Maximage 2 0 คุณสามารถดูวิธีใช้ฟังก์ชันการโทรกลับรวมทั้งความเร็ว fx หมดเวลาเพจและตัวเลือกอื่น ๆ ของ jQuery Cycle การสาธิตนี้ยังใช้ Maximage 2 0 s custom h elper ที่ช่วยให้องค์ประกอบใด ๆ ในสไลด์โชว์มีขนาดใหญ่เช่นภาพพื้นหลังในภาพนิ่งในกรณีนี้เราจะเพิ่มวิดีโอ HTML5 ในสไลด์โชว์ของเรารวมทั้งวิดีโอ Youtube ฉันต้องการวิธีแสดงให้เห็นว่า Maximage2 ช่วยให้คุณสามารถทำอะไรได้บ้าง เพิ่มภาพภายในที่มีองค์ประกอบมากเกินไปไม่เพียงแค่หน้าต่างเบราเซอร์คุณเพียงแค่ผ่านตัวเลือกไปยังตัวเลือก fillElement Maximage2 และคุณจะดีไปนอกจากนี้ยังใช้ fx ที่แตกต่างจากวงจร jQuery เพื่อแสดงวิธีการที่ง่ายที่จะ backgroundSize Maximage2 สามารถ ไม่ว่าจะเป็นปกแบบสตริงหรือมีเพื่อกำหนดว่าภาพจะเติมคอนเทนเนอร์ฝาครอบจะเติมเนื้อที่ว่างทั้งหมดพร้อมกับภาพในขณะที่เพิ่มขนาดภาพสูงสุดภายในพื้นที่ แต่ไม่เกินเนื้อที่ซึ่งเป็นไปได้ว่าเป็นภาพจำลองที่พบมากที่สุด 2 ภาพ แต่ ดีมาก Maximage2 ช่วยให้คุณสามารถเขียนฟังก์ชันของคุณเองที่นี่และนี่คือตัวอย่างของวิธีการที่ทำ. ข้อควรระวังตัวอย่างนี้มีขึ้นสำหรับ exp ert users จำไว้ว่าด้วย FillElement คุณมักจะสามารถทำโครงการออฟเซตได้อย่างง่ายดายเพียงแค่ตั้งค่าองค์ประกอบที่คุณต้องการเพื่อให้รูปภาพแสดงขึ้นเนื่องจากกฎข้อแรกของ Maximage 2 0 คือพยายามที่จะรักษามือของคุณให้พ้นมือ การสนับสนุนค่า offsets ในตัวได้ถูกลดลงแล้วด้วย version 2 0 นี้ไม่ได้หมายความว่าพวกเขา aren t เป็นไปได้ด้วยไขมันข้อศอกเล็กน้อยพวกเขายังสามารถทำได้และดีกว่าสิ่งที่ฉันทำกับรหัสด้านล่างคือการสร้างชดเชยม่านที่อาศัยอยู่ใน หน้าสไลด์โชว์ฉันเรียกผ้าม่านเหล่านี้ฉันได้กระทำนี้กับ HTML และ CSS ด้านล่างสำหรับการชดเชย 100px ที่ด้านบนขวาล่างและขอบด้านซ้ายของ screen. Once เรามีผ้าม่านของเราขึ้นสไลด์โชว์ยังคงปรับขนาดให้เต็ม หน้าต่างและเราต้องการให้มีขนาดใหญ่ที่สุดภายในพื้นที่ที่มองเห็นได้ขนาดหน้าต่างของเราลบการชดเชยของเราด้วยเหตุนี้คุณต้องปรับแต่งฟังก์ชันที่ปรับขนาดหน้าต่างเราสามารถทำได้ด้วยตัวเลือก backgroundSize ที่ถูกส่งผ่านไปยัง Maximage J ตั้งค่าแนวตั้งของคุณและตั้งค่าแนวนอนในตัวอย่าง backgroundSize JS ด้านล่างเพื่อให้ขนาดภาพสไลด์ของคุณภายในพื้นที่ที่มองเห็นได้ภาพที่มีอยู่ภายในการชดเชยเพียงแค่สลับตามความสูงขึ้นอยู่กับกฎความกว้างในฟังก์ชัน backgroundSize เช่นนี้แม็กซ์ภาพ 2 สามารถใช้งานได้ เป็นเครื่องมือที่จะทำให้เกือบทุกอย่างองค์ประกอบพื้นหลังเต็มรูปแบบได้อย่างง่ายดายตัวอย่างนี้แสดงให้เห็นว่ามันสามารถใช้ในการสร้างพื้นหลัง HTML5 วิดีโอข้อเสีย HTML5 fallbacks วิดีโอสำหรับ IE7 IE7 ขณะนี้ไม่ได้กรอกหน้าจอภายในสไลด์โชว์ฉันทำงานในปัจจุบันนี้ แต่ถ้าสิ่งนี้สำคัญสำหรับคุณโปรดใช้สไลด์โชว์ตัวใหม่ในขณะนี้และกลับมาตรวจดูการอัปเดตอีกครั้งเพราะนี่เป็นสิ่งที่พิสูจน์ได้ยากกว่าที่คาดไว้