Create dynamic iframe with auto height

Sometimes we need to create an dynamic iframe with height auto init. I will put a code to create a dynamic iframe inside a modal and add the code to auto height for iframe and modal.

var doc = document.getElementById('iframe_messages').contentWindow.document;;
	doc.innerHTML = "";
		show: true
	$("#emailContentModal .modal-body").css("height", "")
	$("#iframe_messages").css("height", "")
	$('#emailContentModal').on('', function () {
		var messageHeight = $('#iframe_messages').contents().find('html').height();
		var iframeHeight = $('#iframe_messages').height();
		if(iframeHeight < messageHeight) {
			$("#emailContentModal .modal-body").height(messageHeight + 100)
<div class="modal fade emailpp" id="emailContentModal" role="dialog">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal">×</button>
                <h4 class="modal-title">Email Message </h4>
            <div class="modal-body">
                <div id="email_body_content">
                    <h4><span class="normal">Recipient:</span> <span id="receipt_email"></span></h4>
                    <h5>Subject: <span id="subjec_email"></span></h5>
                    <iframe id="iframe_messages" class="iframes_emails" height="600px" width="700px" src="about:blank"></iframe>
                <!-- /#email_body_content -->

Leave a Reply

Your email address will not be published. Required fields are marked *