Este artigo descreve o método do JS para implementar a altura adaptativa do iframe. Compartilhe -o para sua referência, como segue:
Fiquei perturbado com o alto nível de adaptabilidade dos IFRames antes, e muito código JS parece ser burro em FF. Mais tarde, o código a seguir foi finalmente recuperado por mim das milhares de pilhas de código que afirmam ser compatíveis com o FF. Eu usei, é realmente fácil de usar. Especialmente para pessoas como eu, que têm um nível baixo de JS (estou com tanta vergonha), esse código é simples e fácil de entender e conveniente de modificar. Basta copiar e colar o código a seguir na tag <cody> da página em que o iframe está localizado e modifique o nome do ID (observe que existem dois lugares a serem modificados e o local é explicado no código).
Saudação a amigos que criaram este código.
Etapa 1: insira o seguinte código JS sob a tag <body>
<scriptLanguage = "javascript"> function ajusteframesize () {var frm = document.getElementById ("iframe1"); // substitua iframe1 pelo seu nome de identificação var subweb = document.frames? document.frames ["iframe1"]. Document: frm.contentDocument; if (frm! = null && subweb! = null) {frm.style.Height = "0px"; // inicialize, caso contrário, a altura da grande página será retida frm.style.Height = Subweb.documentElement.Scrollheight+"px"; frm.style.width = subweb.documentElement.ScrollWidth+"px"; subweb.body.style.overflowx = "Auto"; subweb.body.style.overflowy = "Auto"; }} </script>Etapa 2: adicione id = "iframe1" onload = "ajusteframesize ()" à tag iframe
Por exemplo: O código do código de cópia é o seguinte: <iframe id = "iframe1" onload = "ajusteframesize ()" scrolling = "no" src = "iframe1.html" width = "100%" alvo = "_ self" frameborder = "0"> </ifram>
Esse código tem uma pequena desvantagem, ou seja, a distância entre o conteúdo no iframe e a borda externa (se a borda externa existir) é um pouco pequena, para que você possa ajustá -lo adequadamente; Além disso, nenhum outro navegador foi testado, exceto IE6.0 ou acima e FF, e nenhum outro defeito foi encontrado. Se você encontrar problemas durante o uso ou tiver uma solução melhor, compartilhe -a.
Se a página do iframe contiver a página carregada com AJAX ou adicionar conteúdo dinamicamente através do JS, você poderá adicionar os seguintes métodos:
1: Adicione o seguinte conteúdo à subpagem
// Modifique a função do endereço da janela dos pais alterar () {window.top.location.hash = "#Height =" + $ (document) .Height ();}Modifique a parte do DOM para chamar esse método
2: Adicione a página pai
// altura adaptativa adaptativa var iframe = document.getElementById ("iframe1"); função ifRameHeight () {var hash = window.Location.hash.slice (1), h; if (hash && /height=/.test(hash)) {h = hash.replace ("height =", ""); iframe.style.Height = h+"px"; window.Location.hash = "#Temp"; // impedem que a altura inalterada ao clicar em outras páginas} setTimeout (ifRameHeight, 100);} ifRameHeight ();Para obter mais informações sobre o conteúdo relacionado ao JavaScript, consulte os tópicos deste site: "Resumo das técnicas de operação JSON em JavaScript", "Resumo dos efeitos e técnicas de comutação de JavaScript", "Resumo de Javascript Search, Summar Techniques de Javscript Effects and Techniques" Summary of JAV de Javscript Effects e Techniques "" Summary of JAV de Javscript Effects and Techniques "" Summary of Jav "JArcript Effects e Techniques" "Summary of JAV de Javscript Effects e Techniques" "Summary of JAV" JAVING EFETHING EFETHENS " Estruturas de dados e técnicas de algoritmo "," Resumo dos algoritmos e técnicas de travessia de JavaScript "e" Resumo do uso de operações matemáticas de JavaScript "
Espero que este artigo seja útil para a programação JavaScript de todos.