การเขียนโปรแกรม iframe

5

ฉันจะซ้อนทับ div ด้วยความทึบกึ่งโปร่งใสบนวิดีโอที่ฝัง iframe ของ youtube ได้อย่างไร <iframe class="youtube-player" type="text/html" width="520" height="330" src="http://www.youtube.com/embed/NWHfY_lvKIQ" frameborder="0"></iframe> <div id="overlay"></div> CSS #overlay { position:fixed; top:0; left:0; width:100%; height:100%; background:#000; opacity:0.8; /*background:rgba(255,255,255,0.8); or just this*/ z-index:50; color:#fff; } แก้ไข (เพิ่มคำอธิบายเพิ่มเติม): HTML5 กำลังเข้ามาใกล้เราโดยมีอุปกรณ์ที่ใช้แทนแฟลชมากขึ้นเรื่อย ๆ ซึ่งทำให้การฝังวิดีโอ youtube ยุ่งยากโชคดีที่ youtube มี iFrame แบบฝังพิเศษที่จัดการปัญหาความเข้ากันได้ของการฝังวิดีโอทั้งหมด แต่ ตอนนี้วิธีการทำงานก่อนหน้านี้ในการวางซ้อนออบเจ็กต์วิดีโอด้วย div กึ่งโปร่งใสใช้ไม่ได้อีกต่อไปตอนนี้ฉันไม่สามารถเพิ่ม a …

110 html css iframe youtube overlay

9

จะแสดงข้อความกำลังโหลดเมื่อ iFrame กำลังโหลดได้อย่างไร?

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

108 javascript jquery iframe

6

มีวิธีเปลี่ยนบริบทเป็น iframe ในคอนโซลจาวาสคริปต์หรือไม่

ฉันต้องการเปลี่ยนบริบทของ javascript ที่เรียกใช้ในคอนโซลเครื่องมือสำหรับนักพัฒนาเว็บ / firebug เพื่อเรียกใช้โค้ดเหมือนทำงานจากภายใน iframe บนหน้า ฉันรู้ว่าฉันทำได้โดยการเปิดเพจใน iframe บนเพจแยกต่างหาก แต่ฉันต้องการเรียกใช้โค้ดที่มันโต้ตอบกับเฟรมหลัก

107 javascript iframe console firebug

6

ตอบสนองต่อ iframe โดยใช้ Bootstrap

ฉันใช้ Bootstrap ฉันมีข้อความที่มีวิดีโอฝังตาม iframe 2 หรือ 3 รายการ ข้อมูลนี้ดึงมาจากฐานข้อมูล ฉันจะทำให้ iframe เหล่านี้ตอบสนองได้อย่างไร ตัวอย่างรหัส: <div class="row"> <div class="col-lg-12 col-md-12 col-sm-12"> SOME TEXT SOME TEXT SOME TEXT SOME TEXT SOME TEXT SOME TEXT SOME TEXT SOME TEXT <iframe src="http://youtube.com/...."></iframe> SOME TEXT SOME TEXT SOME TEXT SOME TEXT SOME TEXT SOME TEXT SOME …

102 twitter-bootstrap iframe

3

ฉันจะตรวจสอบได้อย่างไรว่ามีการโหลด iframe หรือไม่

ฉันกำลังพยายามตรวจสอบว่า iframe โหลดหรือไม่หลังจากที่ผู้ใช้คลิกปุ่ม ฉันมี $('#MainPopupIframe').load(function(){ console.log('load the iframe') //the console won't show anything even if the iframe is loaded. }) HTML <button id='click'>click me</button> //the iframe is created after the user clicks the button. <iframe id='MainPopupIframe' src='http://...' />...</iframe> ข้อเสนอแนะใด ๆ ? อย่างไรก็ตาม iframe ของฉันถูกสร้างขึ้นแบบไดนามิก ไม่โหลดด้วยการโหลดหน้าเริ่มต้น

101 javascript jquery html iframe

5

ฉันมีโค้ดตัวอย่างด้านล่าง ซึ่งใช้ได้ดีกับทุกเบราว์เซอร์ยกเว้นเบราว์เซอร์บนอุปกรณ์มือถือ แท็กล้นคือปัญหา ใช้ได้กับทุกคนยกเว้นมือถือ: margin: 0; padding: 0; height: 100%; overflow: hidden; ใช้งานได้กับมือถือทั้งหมดไม่ใช่คอมพิวเตอร์: margin: 0; padding: 0; height: 100%; อะไรคือวิธีที่ดีที่สุดในการทำให้ทั้งสองอย่างทำงาน <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>Test Layout</title> <style type="text/css"> body, html { margin: 0; padding: 0; height: 100%; overflow: hidden; } </style> </head> <body> …

101 html css iframe

8

การเปลี่ยน iframe src ด้วย Javascript

ฉันกำลังพยายามเปลี่ยน<iframe src=... >เวลาที่มีคนคลิกปุ่มตัวเลือก ด้วยเหตุผลบางประการรหัสของฉันทำงานไม่ถูกต้องและฉันมีปัญหาในการหาสาเหตุ นี่คือสิ่งที่ฉันมี: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta content="text/html; charset=utf-8" http-equiv="Content-Type" /> <title>Untitled 1</title> <script> function go(loc) { document.getElementById('calendar').src = loc; } </script> </head> <body> <iframe id="calendar" src="about:blank" width="1000" height="450" frameborder="0" scrolling="no"></iframe> <form method="post"> <input name="calendarSelection" type="radio" onselect="go('http://calendar.zoho.com/embed/9a6054c98fd2ad4047021cff76fee38773c34a35234fa42d426b9510864356a68cabcad57cbbb1a0?title=Kevin_Calendar&type=1&l=en&tz=America/Los_Angeles&sh=[0,0]&v=1')" />Day <input name="calendarSelection" …

98 javascript iframe src

8

จะย้าย iFrame ใน DOM โดยไม่สูญเสียสถานะได้อย่างไร

ดู HTML ง่ายๆนี้: <div id="wrap1"> <iframe id="iframe1"></iframe> </div> <div id="warp2"> <iframe id="iframe2"></iframe> </div> สมมติว่าฉันต้องการย้ายการห่อเพื่อให้#wrap2อยู่ก่อนหน้า#wrap1. iframe ถูกทำให้เสียโดย JavaScript ฉันตระหนักถึง jQuery .insertAfter()และ.insertBefore(). อย่างไรก็ตามเมื่อฉันใช้สิ่งเหล่านี้ iFrame จะสูญเสียตัวแปร HTML และ JavaScript และเหตุการณ์ทั้งหมด ให้บอกว่าต่อไปนี้เป็น HTML ของ iFrame: <html> <head> <script type="text/javascript" src="jquery.js"></script> <script type="text/javascript"> // The variable below would change on click // This represents changes …

95 javascript jquery dom iframe

7

รับ URL ปัจจุบันจาก IFRAME

มีวิธีง่ายๆในการรับ URL ปัจจุบันจาก iframe หรือไม่? ผู้ชมจะผ่านหลายไซต์ ฉันเดาว่าฉันจะใช้บางอย่างในจาวาสคริปต์

93 javascript url iframe

6

IFrame และ Frame แตกต่างกันอย่างไร

เมื่อดูตัวเลือกสำหรับการฝังหน้า 3D Secure ในแบบฟอร์มคำสั่งซื้อของฉันฉันพบสิ่งต่อไปนี้: "ไซต์การค้าบางแห่งจะใช้หน้าเบราว์เซอร์แบบเต็มในการตรวจสอบสิทธิ์แทนที่จะใช้เฟรม (ไม่จำเป็นต้องเป็น iFrame ซึ่งเป็นวัตถุที่มีความปลอดภัยน้อยกว่า)" จากhttp://en.wikipedia.org/wiki/3-D_Secure ใครช่วยบอกฉันหน่อยได้ไหมว่าทำไม iframe ถึงมีความปลอดภัยน้อยกว่าและทำให้เกิดปัญหาเมื่อเทียบกับเฟรมปกติ และอะไรคือความแตกต่างพื้นฐาน? วิธีที่ฉันเห็นiframeคือหนทางที่จะไป

92 html iframe frame

14

IFrames (HTML) ล้าสมัยหรือไม่ [ปิด]

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

91 html iframe obsolete

4

การระบุเนื้อหาของ iframe แทนแอตทริบิวต์ src ไปยังเพจ

ฉันกำลังดำเนินการกับแบบฟอร์มที่มีอินพุตไฟล์สำหรับอัปโหลดรูปภาพ มีonchange()เหตุการณ์สำหรับอินพุตเหล่านั้นที่ส่งรูปภาพไปยังiframeจากนั้นโหลดรูปภาพที่อัปโหลดลงในฟอร์มแบบไดนามิกโดยมีฟิลด์ที่จะแก้ไขสำหรับรูปภาพเหล่านั้น (เช่นชื่อและการแปลตามพื้นที่ทางภูมิศาสตร์ ) เนื่องจากฉันไม่สามารถซ้อนแบบฟอร์มได้file_inputจึงมีอยู่ในiframeไฟล์. ในท้ายที่สุดฉันใช้ไฟล์iframeภายในของอีกiframeอัน ดังนั้นฉันจึงมีสิ่งนี้: <form>  <iframe src="file_input_url">  </iframe> </form> และ HTML ที่โหลดลงในiframeนั้นเป็นสิ่งที่ต้องการ (ไม่รวมhtml,headและbodyแท็ก) <form target="upload_iframe"> <input type="file" onchange="this.form.submit()"> </form> <iframe name="upload_iframe"></iframe> วิธีนี้ใช้งานได้ดียกเว้นการโหลดครั้งแรกใช้เวลาสองถึงสามวินาทีiframeดังนั้นอินพุตไฟล์จึงไม่โหลดพร้อมกับส่วนที่เหลือของหน้า สิ่งนี้ไม่เหมาะกับสายตา ฉันสามารถแก้ไขได้ถ้าฉันสามารถระบุiframeเนื้อหาโดยไม่จำเป็นต้องโหลดหน้าอื่น (ระบุไว้file_input_urlในหน้าแรกiframe) มีวิธีระบุiframeเนื้อหาในเอกสารเดียวกันหรือไม่หรือระบุเฉพาะกับsrcแอตทริบิวต์โดยต้องโหลดหน้าอื่น

90 html iframe

3

ฉันจะเปลี่ยนเนื้อหาใน iframe แบบไดนามิกโดยใช้ jquery ได้อย่างไร

ฉันสงสัยว่าเป็นไปได้ไหมที่จะมีไซต์ที่มี iframe และโค้ด jquery ที่เปลี่ยนเนื้อหา iframe ทุกๆ 30 วินาที เนื้อหาอยู่ในหน้าเว็บที่แตกต่างกัน สิ่งนี้: <html> <head> <script type="text/javascript" src="jquery.js"></script> <script> $(document).ready(function(){ var array = new array(); array[0] = 'http://webPage1.com'; array[1] = 'http://webPage2.com'; // And so on. // Do something here to change the iframe every 30 second }); </script> </head> <body> <iframe id="frame"></iframe> …

89 jquery iframe

12

ทำไมคนยังใช้ iframe? [ปิด]

ตามที่กล่าวมาในปัจจุบันคำถามนี้ไม่เหมาะสำหรับรูปแบบถาม & ตอบของเรา เราคาดหวังว่าคำตอบจะได้รับการสนับสนุนจากข้อเท็จจริงการอ้างอิงหรือความเชี่ยวชาญ แต่คำถามนี้อาจก่อให้เกิดการถกเถียงโต้แย้งการสำรวจความคิดเห็นหรือการอภิปรายเพิ่มเติม หากคุณรู้สึกว่าคำถามนี้สามารถปรับปรุงได้และอาจเปิดใหม่ได้โปรดไปที่ศูนย์ช่วยเหลือเพื่อรับคำแนะนำ ปิดให้บริการใน10 ปีที่ผ่านมา สำหรับฉัน iframe เป็นสิ่งชั่วร้ายที่บริสุทธิ์ (อาจจะไม่บริสุทธิ์เท่าไหร่) ดูเหมือนว่าพวกเขาจะสร้างปัญหามากมาย ใช่ไซต์ทั้งหมดของคุณจะโหลดหนึ่งครั้งจากนั้นคุณสามารถโหลดได้เพียงหน้าเดียว แต่ผู้คนคิดค้น AJAX เพื่อจุดประสงค์นี้ ปัญหาใหญ่ที่สุดอย่างหนึ่งที่ฉันพบiframeคือฉันไม่สามารถวางลิงก์ไปยังหน้าย่อยใดหน้าหนึ่งได้เนื่องจาก URL ไม่เคยเปลี่ยนแปลง (ใช่ฉันรู้ว่ามีวิธีแก้ปัญหาสำหรับสิ่งนี้) ประการที่สองเครื่องมือค้นหาเว็บอาจมีปัญหาในการจัดทำดัชนีไซต์นั้นอย่างถูกต้อง บางครั้งการเข้าถึงเว็บไซต์นี้แย่ลงและเบราว์เซอร์บางตัวอาจแสดงผลไม่ถูกต้อง มีวิธีที่ดีกว่าในการออกแบบเค้าโครงโดยไม่มี (i) เฟรม ทุกวันฉันเห็นบางคนถามคำถาม SO เช่น "จะเข้าถึง iframe ด้วย jQuery ได้อย่างไร" แล้ว iframe มีประโยชน์อย่างไร? มีเหตุผลอะไรที่จะยังคงใช้มันอยู่? ฉันแค่อยากรู้ว่าทำไม :) (เนื่องจากไม่ใช่คำถามจริงจึงเป็น CW)

89 iframe

3

วิธีการแทนที่ X-Frame-Options สำหรับคอนโทรลเลอร์หรือการดำเนินการใน Rails 4

ดูเหมือนว่า Rails 4 จะกำหนดค่าเริ่มต้นSAMEORIGINสำหรับX-Frame-Optionsส่วนหัวการตอบกลับ HTTP สิ่งนี้ยอดเยี่ยมสำหรับการรักษาความปลอดภัย แต่ไม่อนุญาตให้บางส่วนของแอปของคุณพร้อมใช้งานในiframeโดเมนอื่น คุณสามารถแทนที่ค่าของX-Frame-Optionsทั่วโลกโดยใช้การconfig.action_dispatch.default_headersตั้งค่า: config.action_dispatch.default_headers['X-Frame-Options'] = "ALLOW-FROM https://apps.facebook.com" แต่คุณจะแทนที่มันได้อย่างไรสำหรับคอนโทรลเลอร์หรือการดำเนินการเดียว?

89 ruby-on-rails iframe http-headers ruby-on-rails-4 x-frame-options

คำถามติดแท็ก iframe