WorldWideScripts.net Delivering the best Add-Ons in more than 37 languages.

中文(简体), English, हिन्दी/हिंदी, Español/Castellano, العربية, Русский язык, Français, 中文 (台灣), বাংলা, Bahasa Indonesia, اردو, Português, Deutsch, Bahasa Melayu (بهاس ملايو‎), 日本語 (にほんご), فارسی, Italiano, తెలుగు, Türkçe, ગુજરાતી, Język polski/polszczyzna, Tiếng Việt, ಕನ್ನಡ, Українська мова, ไทย
HTML5 / Media

HTML5 Blue Video Gallery

— Add-on เพื่อ WorldWideScripts.net

สมัครสมาชิกฟีด ของเรา จะอยู่ถึง วันที่ !

ใหม่! ติดตามเรา ตามที่คุณต้องการ!


HTML5 Blue Video Gallery - CodeCanyon Item for Sale

Ads

Ad: Bluehost hosting

envato AftESS สนับสนุนบอร์ด FASTSI.FPORT

แนะนำ

ต้องการแกลลอรี่ภาพที่ง่ายต่อการติดตั้งและปรับแต่งการทำงานในเบราว์เซอร์ (แม้ IE8) ขึ้นอยู่กับมาตรฐานล่าสุด (HTML5) ได้รับการสนับสนุนมัลติมีเดียเกินไป (เสียง / ภาพ) สามารถเลี้ยงจากผู้ให้บริการแชร์วิดีโอ (ยูทูป / Vimeo) แล้วนี้เป็นแกลลอรี่ภาพที่จะแสดงวิดีโอของคุณบนเว็บไซต์ของคุณ

แกลเลอรี่งานในสภาพแวดล้อมของเบราว์เซอร์ทั้งหมดที่สำคัญ - รวมทั้ง IE ผ่านฤดูใบไม้ร่วงหลังแฟลช นอกจากนี้โดยการป้อนวิดีโอเดียวในแกลเลอรี่วิดีโอมันจะกลายเป็นเครื่องเล่นวิดีโอ

หอศิลป์แห่งนี้ใช้ล่าสุด tehniques html5 ยกตัวอย่างเช่น - จะใช้ HTML5 localStorage จะจำปริมาณสุดท้ายที่คุณมีก่อนที่คุณจะออกจากด้านหลังและตั้งระดับเสียงที่ว่าเมื่อคุณกลับมา ผิวมีการติดตั้งผ่านทาง CSS ง่าย - ดังนั้นจึงเป็นได้อย่างเต็มที่ผิวสามารถด้วย CSS ขั้นพื้นฐาน

อัพเดท

UPDATE 8.00 [2014/09/22]

  • [แก้ไข] ข้อบกพร่องบางอย่าง

UPDATE 7.50 [2014/04/08]

  • [บิด] เปลี่ยนตอนนี้มากนุ่มนวล
  • [บิด] อัพเดตตัวอย่าง

UPDATE 7.44 [2014/03/26]

  • [แก้ไข] ข้อบกพร่องหลาย
  • [แก้ไข] ตัวอย่าง
  • [แก้ไข] เพิ่มการสนับสนุนคำบรรยาย

UPDATE 6.78 [2013/10/14]

  • [แก้ไข] ข้อบกพร่องหลาย

UPDATE 6.10 [2013/10/02]

  • [แก้ไข] ข้อผิดพลาดในตอนจบของวิดีโอ YouTube, เสียงจะยังคงเล่น
UPDATE 5.11 [2013/10/02]
  • แก้ไขข้อผิดพลาดร้ายแรง IE9 / IE10
  • การปรับปรุงการทำงานร่วมกับ jQuery 1.9.1 โดยไม่ต้องปลั๊กอินโยกย้าย
UPDATE 5.00 [2013/01/10]
  • เพิ่มปุ่ม HD สำหรับวิดีโอ YouTube
  • เพิ่มวิธีการใหม่เพื่อเลื่อน thumbsandarrows เมนู (ตรวจสอบสาธิต YouTube Channel ในการแสดงตัวอย่าง)
  • เพิ่มสามโหมดใหม่ - โรซาลี, rotator3d และผนัง
  • หนังสำหรับแกลลอรี่และเล่นอยู่ในขณะนี้เป็นอิสระ
  • เพิ่มผิวแกลเลอรี่ใหม่ - nav_transparent - รายการเมนูนำทางวงกลมและมีความโปร่งใส
  • เพิ่มผิวใหม่ที่น่ากลัวสำหรับผู้เล่น - ออโรร่า
  • เอกสารการปรับปรุง
  • ข้อบกพร่องอื่น ๆ คงที่
UPDATE 4.10 [2012/10/22]
  • ข้อบกพร่องคงเต็มจอ (ทำงานอย่างสมบูรณ์แบบใน Safari, Chrome, Firefox และเบราว์เซอร์ที่สอดคล้องในอนาคต)
  • เพิ่มการสนับสนุนการโฆษณา - ภาพ / โฆษณา YouTube หรือวิดีโอ
  • ข้อบกพร่องอื่น ๆ คงที่
UPDATE 4.0 [2012/05/02]
  • การแก้ไขข้อบกพร่องบางอย่าง
  • แกลเลอรี่วิดีโอที่มีการเปลี่ยนแปลงและเล่นวิดีโอโครงสร้าง DOM
  • เพิ่มบาร์บัฟเฟอร์ใหม่
  • เพิ่มการสนับสนุน Vimeo
  • เสียงสนับสนุนเพิ่ม
  • สนับสนุนภาพเพิ่ม
  • เพิ่มปุ่มฝัง
  • ปุ่มหุ้นเพิ่ม
  • เพิ่มเต็มจอที่แท้จริงสำหรับ Chrome, Safari, Firefox
UPDATE 3.0 [2012/02/23]
  • การแก้ไขข้อบกพร่องบางอย่าง
  • เอกสารการปรับโครงสร้างหนี้
  • แกลเลอรี่วิดีโอที่มีการเปลี่ยนแปลงและเล่นวิดีโอโครงสร้าง DOM

UPDATE 2.0 [2011/07/09]

  • การแก้ไขข้อบกพร่องบางอย่าง
  • iPod / iPad / iPhone รองรับ
  • การปรับปรุงเพื่อมาตรฐานล่าสุด HTML5

คุณสมบัติ

  • มุ่งเน้นไปที่วิดีโอ - ปุ่มเต็มหน้าจอช่วยให้คุณเพลิดเพลินกับวิดีโอในหน้าต่างเบราว์เซอร์ทั้งหมด
  • html5 ขับเคลื่อน - องค์ประกอบวิดีโอ HTML5 และ JavaScript localStorage นี้ทำให้แกลเลอรี่ที่ทันสมัย
  • จำได้ว่าค่าของคุณ - เครื่องเล่นนี้ใช้ localStorage Html5 ในเพื่อเก็บปริมาณสุดท้ายที่คุณได้ตั้งดังนั้นเมื่อคุณปิดหน้าและเปิดต่อมาปริมาณที่เหมาะสมกลับที่คุณทิ้งมัน
  • เข้ากันได้กับเบราว์เซอร์ที่สำคัญทั้งหมดรวมทั้ง IE - ทางเลือกให้แฟลชสำหรับเบราว์เซอร์ที่ไม่สนับสนุนแท็กวิดีโอ (คุณสามารถระบุว่าวิดีโอจะเล่นผ่าน FlashVars) ผู้เล่นวิดีโอแฟลชมีผิวเช่นเดียวกับหนึ่งเริ่มต้นเพื่อให้มันดู เดียวกันในทุกแพลตฟอร์ม
  • iPhone / iPad เข้ากันได้ - แกลเลอรี่นี้ได้รับการปรับปรุงอุปกรณ์สัมผัสแอปเปิ้ล
  • css ที่กินขับเคลื่อน - แกลเลอรี่ css ที่จะแบ่งออกเป็นสองส่วน - การทำงานและ estethic จึงเป็นเรื่องง่ายมากที่จะทำให้ผิวของคุณเอง

    สินทรัพย์

    วิดีโอจาก - http://www.bigbuckbunny.org/

    คำถามที่พบบ่อย

    วิดีโอ 1 ทำงานได้ดี แต่วิดีโอ 2 ไม่ได้โหลดเลย
    ส่วนใหญ่อาจคุณกำลังทดสอบและได้แนบวิดีโอ youtube เดียวกัน คุณไม่สามารถมีวิดีโอ youtube เดียวกันในสถานที่ 2 แห่ง
    ฉันจะฝังเข้าไปในลิงค์ Vimeo มันได้หรือไม่
    เพียงแค่เพิ่มมาร์กอัปนี้ภายใน videogallery ปรับอากาศ
     <div class = "VPlayer-Tobe" data-videoTitle = 'วิดีโอ Vimeo' ข้อมูลประเภท = "Vimeo" data-src = "31539657"> <div ชั้น = "menuDescription"> <img src = "http: // dummyimage.com / 50x50 / 000000 / fff และข้อความ = หัวแม่มือ "class =" imgblock "/> <div ชั้น =" ชื่อ "> นี่คือวิดีโอ Vimeo </ div> ภาพย่อสามารถ autogenerate... </ div> </ div> 
    เปลี่ยนค่าข้อมูล src มี id ของวิดีโอ Vimeo ของคุณ
    นี้สามารถใช้สำหรับวิดีโอที่มีไม่ได้อยู่ใน Vimeo หรือ YouTube? ฉันมีวิดีโอบางโฮสต์บนเซิร์ฟเวอร์ฉันต้องการที่จะเชื่อมโยงโดยตรง กรุณาแจ้งให้เราทราบโดยเร็ว ขอบคุณ
    แน่นอนว่ามันทำมาโดยเฉพาะสำหรับการเล่นวิดีโอตัวเองเป็นเจ้าภาพ YouTube และ Vimeo เป็นเพียงโบนัส
    ฉันจะได้รับไอคอนสื่อสังคมในการทำงานอย่างไร
    การตรวจสอบการตั้งค่า shareCode สำหรับฟังก์ชั่น vGallery
    ฉันจะทำให้วิดีโอของฉันวิธีการเข้ารหัสอย่างถูกต้องเพื่อใช้ภายในแกลเลอรี่นี้หรือไม่?

    คุณต้องภาพยนตร์ของคุณแปลงเป็น 2 รูปแบบในการสั่งซื้อเพื่อให้แน่ใจว่าวิดีโอ HTML5 เล่นในเบราว์เซอร์

    สนับสนุนเบราว์เซอร์และแนะนำโปรแกรมการเข้ารหัส

    IE9, IE8 (Flash) และ Safari: M4V -> http://handbrake.fr/

    Chrome และ Opera และ Firefox: OGG-> http://video.online-convert.com/convert-to-ogg

    วิดีโอโครงสร้าง DOM

     <div class = "VPlayer" ข้อมูลคำอธิบาย = "วิดีโอของฉัน" ข้อมูล img = "img / 1.jpg"> <ควบคุมวิดีโอพรีโหลด> <แหล่ง src = "/ วิดีโอ myvideo.m4v" /> <แหล่ง src = "/ วิดีโอ myvideo.ogg" /> <ชนิดของวัตถุ = "application / x-shockwave-แฟลช" ข้อมูล = "preview.swf" width = "550" height = "300" id = "flashcontent" style = "การแสดงผล: มองเห็น;"> <ชื่อพารามิเตอร์ = "ภาพยนตร์" value = "preview.swf"> <param name = "เมนู" value = "เท็จ"> <param name = "allowScriptAccess" value = "เสมอ"> <ชื่อพารามิเตอร์ = "ขนาด" value = "noscale"> <param name = "allowFullScreen" value = "true"> <param name = "wmode" value = "ขุ่น"> <ชื่อพารามิเตอร์ = "flashvars" value = "วิดีโอ = วิดีโอ / myvideo.m4v"> </ object> </ วิดีโอ> </ div> 

    ฉันมีวิดีโอของฉันพร้อมฉันจะเพิ่ม whitin แกลเลอรี่?

    วิธีที่ดีที่สุดที่จะเรียนรู้ว่าถ้าคุณไม่สอดคล้องกับ html ที่เป็นตัวอย่าง เปิดแหล่งที่มา / index.html และ 122 รอบสายคุณจะเห็น:

    [.. ]
    <div class = "VPlayer" ข้อมูลคำอธิบาย = "<img src = 'img / thumb.png' class = 'imgblock' /> วิดีโอ 5" data-img = "img / 1.jpg">

    <ควบคุมวิดีโอพรีโหลด>
    <แหล่ง src = "/ วิดีโอ test.mp4" type = 'วิดีโอ / mp4; ตัวแปลงสัญญาณ = "avc1.42E01E, mp4a.40.2" />
    <แหล่ง src = "/ วิดีโอ test.webm" type = '/ วิดีโอ webm; ตัวแปลงสัญญาณ = "VP8, Vorbis" />
    <แหล่ง src = "/ วิดีโอ test.ogg" type = 'วิดีโอ / OGG; ตัวแปลงสัญญาณ = "Theora, Vorbis" />
    <แหล่ง src = "/ วิดีโอ bubbles.m4v" />

    <ความกว้างของวัตถุ = "500" height = "300">
    <ชื่อพารามิเตอร์ = "ภาพยนตร์" value = "preview.swf? = วิดีโอวิดีโอ / advideo.flv"> </ param>
    <ชื่อพารามิเตอร์ = "allowFullScreen" value = "true"> </ param>
    <ชื่อพารามิเตอร์ = "allowScriptAccess" value = "เสมอ"> </ param>
    <ชื่อพารามิเตอร์ = "wmode" value = "ขุ่น"> </ param>
    <ฝัง src = "preview.swf? = วิดีโอวิดีโอ / advideo.flv" type = "application / x-shockwave-แฟลช" width = "500" height = "300" allowScriptAccess = "เสมอ" allowfullscreen = "true" wmode = "ทึบ">
    </ ฝัง>
    </ object>
    </ วิดีโอ>
    </ div>

    </ div> <! -End VIDEO แกลลอรี่ ->

    นี้เป็นวิดีโอที่ผ่านมาในแกลลอรี่และก็เป็นตัวอย่างที่ดีเพื่อให้โคลนที่และชื่อวิดีโอ 6 แทนวิดีโอ 5

    [.. ]
    <div class = "VPlayer" ข้อมูลคำอธิบาย = "<img src = 'img / thumb.png' class = 'imgblock' /> วิดีโอ 5" data-img = "img / 1.jpg">

    <ควบคุมวิดีโอพรีโหลด>
    <แหล่ง src = "/ วิดีโอ test.mp4" type = 'วิดีโอ / mp4; ตัวแปลงสัญญาณ = "avc1.42E01E, mp4a.40.2" />
    <แหล่ง src = "/ วิดีโอ test.webm" type = '/ วิดีโอ webm; ตัวแปลงสัญญาณ = "VP8, Vorbis" />
    <แหล่ง src = "/ วิดีโอ test.ogg" type = 'วิดีโอ / OGG; ตัวแปลงสัญญาณ = "Theora, Vorbis" />
    <แหล่ง src = "/ วิดีโอ bubbles.m4v" />

    <ความกว้างของวัตถุ = "500" height = "300">
    <ชื่อพารามิเตอร์ = "ภาพยนตร์" value = "preview.swf? = วิดีโอวิดีโอ / advideo.flv"> </ param>
    <ชื่อพารามิเตอร์ = "allowFullScreen" value = "true"> </ param>
    <ชื่อพารามิเตอร์ = "allowScriptAccess" value = "เสมอ"> </ param>
    <ชื่อพารามิเตอร์ = "wmode" value = "ขุ่น"> </ param>
    <ฝัง src = "preview.swf? = วิดีโอวิดีโอ / advideo.flv" type = "application / x-shockwave-แฟลช" width = "500" height = "300" allowScriptAccess = "เสมอ" allowfullscreen = "true" wmode = "ทึบ">
    </ ฝัง>
    </ object>
    </ วิดีโอ>
    </ div>
    <div class = "VPlayer" ข้อมูลคำอธิบาย = "<img src = 'img / thumb.png' class = 'imgblock' /> วิดีโอ 6" ข้อมูล img = "img / 1.jpg">

    <ควบคุมวิดีโอพรีโหลด>
    <แหล่ง src = "/ วิดีโอ test.mp4" type = 'วิดีโอ / mp4; ตัวแปลงสัญญาณ = "avc1.42E01E, mp4a.40.2" />
    <แหล่ง src = "/ วิดีโอ test.webm" type = '/ วิดีโอ webm; ตัวแปลงสัญญาณ = "VP8, Vorbis" />
    <แหล่ง src = "/ วิดีโอ test.ogg" type = 'วิดีโอ / OGG; ตัวแปลงสัญญาณ = "Theora, Vorbis" />
    <แหล่ง src = "/ วิดีโอ bubbles.m4v" />

    <ความกว้างของวัตถุ = "500" height = "300">
    <ชื่อพารามิเตอร์ = "ภาพยนตร์" value = "preview.swf? = วิดีโอวิดีโอ / advideo.flv"> </ param>
    <ชื่อพารามิเตอร์ = "allowFullScreen" value = "true"> </ param>
    <ชื่อพารามิเตอร์ = "allowScriptAccess" value = "เสมอ"> </ param>
    <ชื่อพารามิเตอร์ = "wmode" value = "ขุ่น"> </ param>
    <ฝัง src = "preview.swf? = วิดีโอวิดีโอ / advideo.flv" type = "application / x-shockwave-แฟลช" width = "500" height = "300" allowScriptAccess = "เสมอ" allowfullscreen = "true" wmode = "ทึบ">
    </ ฝัง>
    </ object>
    </ วิดีโอ>
    </ div>

    </ div> <! -End VIDEO แกลลอรี่ ->





    FIY, แกลเลอรี่นี้ถูกสร้างขึ้นโดยผู้เขียนที่ขายดีที่สุด, แกลเลอรี่หุ้นที่โดดเด่นมากที่สุดบนอินเทอร์เน็ตที่ได้รับการปรับปรุงอย่างต่อเนื่อง (เพิ่มเติมแล้ว 10 เพื่อให้ห่างไกล)
    กิน iPhone iPad Compal skinable minut FlashVars erabIed videos7 ท้องถิ่นและโม! envato AftESS สนับสนุนบอร์ด FASTSI.FPORT

  • ดาวน์โหลด
    ส่วนประกอบอื่น ๆ ในประเภทนี้ส่วนประกอบทั้งหมดของ ผู้เขียนคนนี้
    ความเห็นคำถามที่พบบ่อย และคำตอบ

    คุณสมบัติ

    สร้าง:
    3 กันยายน 10

    ปรับปรุงล่าสุด:
    22 กันยายน 14 ความละเอียดสูง

    เบราว์เซอร์ที่เข้ากันได้:
    IE7, IE8, IE9, IE10, IE11, Firefox, Safari, Opera, Chrome

    ไฟล์รวม:
    JS JavaScript, HTML, CSS, SWF / FLV

    เวอร์ชั่นของซอฟต์แวร์:
    HTML5

    คำหลัก

    อีคอมเมิร์ซทุกรายการ, คำอธิบาย, Flash, ทางเลือกแฟลช flashvars, fullscren, แกลเลอรี่, กราฟิก, HTML5 คือภาพข้อมูล localStorage, วิดีโอ, ปริมาณ, XML