iframe के भीतर गतिशील शंकु के आधार पर iframe की ऊंचाई कैसे बदलें?

Question

मेरे पास एक आईफ्रेम है जिसमें गतिशील सामग्री है। यदि उत्तर विशिष्ट प्रश्न हैं, तो अतिरिक्त जानकारी प्रदर्शित होती है (छुपा div दिखाई देता है)। मैं आईफ्रेम की ऊंचाई का विस्तार करना चाहता हूं। मुझे पता है कि इस सवाल को कई बार यहां पूछा गया है, लेकिन ऐसा लगता है कि यह आमतौर पर होता है जब आईफ्रेम के भीतर एक अलग पृष्ठ लोड होता है, न कि जब सामग्री आईफ्रेम के भीतर गतिशील रूप से बदल जाती है।

आइफ्रेम: http://jsfiddle.net/B4AKc/2/

पेज: http://jsfiddle.net/PmBrd/

कोई भी विचार

यहाँ एक उदाहरण मैं एक साथ jsFiddle का उपयोग कर डालने की कोशिश की है?

Answer 1

क्या यह आपके लिए काम करता है?

http://jsfiddle.net/PmBrd/1/

कोड:

var iframe = document.getElementById("ifr").contentWindow; 

iframe.$(".toggle_div").bind("change", function() { 
    $("#ifr").css({ 
     height: iframe.$("body").outerHeight() 
    }); 
}); 

जब से तुम उल्लेख किया है कि वे एक ही डोमेन में हैं, यह अपने वास्तविक अनुप्रयोग के साथ कुछ ऐसा ही करने का सिर्फ एक बात है।

Answer 2

jQuery postMessage प्लगइन पर एक नज़र डालें। यह आपको बच्चे के फ्रेम से माता-पिता को जानकारी पास करने की अनुमति देता है। सामग्री परिवर्तन पर अभिभावक को सामग्री ऊंचाई पोस्ट करने के लिए आप बच्चे के फ्रेम के अंदर कोड बदल सकते हैं, जिसके बाद माता-पिता तदनुसार आईफ्रेम का आकार बदलने के लिए उपयोग कर सकते हैं।

दो पृष्ठ काम करने के लिए एक ही डोमेन पर होना चाहिए।

मुझे आशा है कि इस मदद करता है!

Answer 3

Esailija का उत्तर ठीक काम करता है, लेकिन यह अच्छा इमो है।

$('#ifr').contents($(".toggle_div")).bind("change", function() { 
    $("#ifr").height($("#ifr").contents().find("html").height()); 
}); 

Answer 4

इसे जांचें। आप जावास्क्रिप्ट का उपयोग कर आईफ्रेम आकार प्राप्त कर सकते हैं।
सेट इंटरवल का उपयोग करके, हर बार विंडो की ऊंचाई की जांच करें।

< iframe src='<YOUR_URL>' frameborder='0' scrolling='no' id='frame_id' style='overflow:hidden; width:984px;' > 
</iframe> 

<script language="javascript" type="text/javascript"> 
setInterval(function(){ 
    document.getElementById("frame_id").style.height = document.getElementById("frmid").contentWindow.document.body.scrollHeight + 'px'; 
},1000) 
</script> 

Check this

Answer 5

थोड़ी देर हो चुकी हो सकता है, के रूप में सभी अन्य उत्तर 2011 :-) से here's मेरी समाधान कर रहे हैं लेकिन ...। वास्तविक एफएफ, क्रोम और सफारी 5.0

$(document).ready(function(){ 
    $("iframe").load(function() { 
     var c = (this.contentWindow || this.contentDocument); 
     if (c.document) d = c.document; 
     var ih = $(d).outerHeight(); 
     var iw = $(d).outerWidth(); 
     $(this).css({ 
      height: ih, 
      width: iw 
     }); 
    }); 
}); 

उम्मीद है कि यह किसी की भी मदद करेगा।