Resize an iframe according to the page in Bootstrap tabs

Hi,

I am using bootstrap tabs on my page



on each tab i want to show different web page in the same solution, for this i have used iframe.

and below is the code which i am using for iframe resize on iframe onload function for active tab and calling autoresize function on tab change event.

 $(function () {
            $('a[data-toggle="tab"]').on('show.bs.tab', function (e) {

var activatedTab = $(e.target).attr("href"); // activated tab

var frameid = activatedTab.replace("#dv", "frm");
autoresize(frameid);
});

function autoResize(id) {

 $(id).css("height", $(id).contents().context.documentElement.scrollHeight + "px");
}

but i am not able to see whole page in the iframe. 

Could anyone please suggest me where i am going wrong....?

Thanks,

Success is not to be pursued; it is to be attracted by the person we become.