ZZzzz~ pode acabar
<Iframe src="/URL" width="x" height="x" scrolling="[OPTION]" frameborder="x"></iframe>
src: O caminho do arquivo, que pode ser um arquivo HTML, texto, ASP, etc.;
largura, altura: a largura e a altura da área "picture-in-picture";
rolagem: Quando o arquivo HTML especificado do SRC não é exibido na área especificada, a opção de rolagem, se definida como NÃO, a barra de rolagem não aparecerá se for Auto: a barra de rolagem aparecerá automaticamente se for Sim; ele será exibido;
frameborder: A largura da borda da área para mesclar a "imagem na imagem" com o conteúdo adjacente, geralmente é definida como 0.
Por exemplo:
<Iframe src=" http://www.xyz.com/xyz "; width="250" height="200" scrolling="no" frameborder="0"></iframe>
Entre janela e flutuante frame Na linguagem de script e hierarquia de objetos, a janela que contém o Iframe é chamada de formulário pai, e o quadro flutuante é chamado de formulário filho. É importante esclarecer a relação entre os dois, pois é necessário controlar o Iframe no. o formulário pai Ao acessar um subformulário ou vice-versa, você deve conhecer a hierarquia de objetos antes de poder acessar e controlar o formulário por meio de um programa.
1. Acesse e controle os objetos do subformulário no formulário pai No formulário pai, o Iframe, ou seja, o subformulário, é um objeto filho do objeto de documento. Você pode acessar diretamente os objetos do subformulário no script. .
Agora fica uma dúvida, ou seja, como controlamos esse Iframe. Aqui precisamos falar sobre o objeto Iframe. Ao definirmos o atributo ID para esta tag, podemos realizar uma série de controles no HTML contido no Iframe através do Document Object Model DOM.
Por exemplo, incorpore o arquivo test.htm em example.htm e controle alguns objetos de tag em test.htm:
<Iframe src="test.htm" id="test" width="250" height="200" scrolling="no" frameborder="0"></iframe>
O código do arquivo test.htm é:
<html>
<corpo>
<h1 id="myH1">olá, meu garoto</h1>
</body>
</html>
Se quisermos alterar o texto da tag H1 com número de identificação myH1 para olá, meu caro, podemos usar:
document.myH1.innerText="olá,meu querido"(documento pode ser omitido)
No arquivo example.htm, o subformulário apontado pelo objeto de marca Iframe é consistente com o modelo geral de objeto DHTML e o método de controle de acesso ao objeto é o mesmo, portanto não entrarei em detalhes.
2. Acessar e controlar os objetos do formulário pai no formulário filho. No formulário filho, podemos acessar os objetos na janela pai através de seu objeto pai (pai).
Como exemplo.htm:
<html>
<body onclick="alert(tt.myH1.innerHTML)"> <Iframe name="tt" src="frame1.htm" width="250" height="200" scrolling="no" frameborder="0"> </iframe>
<h1 id="myH2">olá, minha esposa</h1>
</body>
</html>
Se quisermos acessar o texto do título em frame1.htm com o número de identificação myH2 e alterá-lo para “olá, meu amigo”, podemos escrever assim:
parent.myH2.innerText = "olá, meu amigo"
Aqui o objeto pai representa o formulário atual (o formulário onde está localizado example.htm). Para acessar os objetos do formulário pai no formulário filho, sem exceção, é feito através do objeto pai.
Embora o Iframe esteja incorporado em outro arquivo HTML, ele permanece relativamente independente e é um "reino independente". As características de um único HTML também se aplicam a quadros flutuantes.
Imagine, por meio da tag Iframe, podemos expressar o conteúdo inalterado como um Iframe. Dessa forma, não precisamos escrever o mesmo conteúdo repetidamente. Isso é um pouco como um processo ou função de programação, e é muito tedioso. o trabalho manual é salvo! Além disso, e o mais importante, torna as modificações de página mais viáveis, porque em vez de ter que modificar cada página para ajustar o layout, você só precisa modificar o layout de um formulário pai.
Deve-se observar que as versões anteriores ao Nestscape 6.0 não suportam a tag Iframe.
Exemplo:
<iframe src="Page" width="Width" height="Height" align="A disposição pode ser esquerda ou direita, centro" scrolling="Se houver uma barra de rolagem, preencha não ou sim">< /iframe>
< IFRAME frameBorder=0 frameSpacing=0 height=25 marginHeight=0 marginWidth=0 scrolling=no
name=main src="/bgm/bgm.html" width=300></IFRAME>
Depois de usar o iframe, descobri que a barra de rolagem não é bonita e quero usar 2 imagens em vez disso↑↓
Como isso deve ser alcançado?
responder:
Substitua <title>..</title> da página da web pelo seguinte código
<SCRIPT LANGUAGE="javascript">
rolagem de função (n)
{temperatura=n;
Out1.scrollTop=Out1.scrollTop+temp;
if (temp==0) retornar;
setTimeout("scroll(temp)",80);
}
</SCRIPT>
<LARGURA DA TABELA="330">
<TR>
<TD WIDTH="304" VALIGN="TOP" ROWSPAN="2" >
<DIV ID=Out1 STYLE="largura:100%; altura:100;overflow: oculto ;estilo de borda:tracejado;largura da borda:
1px,1px,1px,1px;">
texto<BR> texto<BR>
Texto<BR>
Texto<BR>
Palavra
<BR>
<BR>
</DIV>
</TD>
< TD WIDTH="14" VALIGN="TOP"><IMG SRC="photo/up0605.gif" WIDTH="14" HEIGHT ="20" onmouseover="scroll(-1)" onmouseout="scroll(0) " onmousedown="scroll (-3)" BORDER="0" ALT="Pressionar o mouse tornará mais rápido"></TD>
</TR>
<TR>
< TD WIDTH="14" VALIGN="BOTTOM"><IMG SRC="foto/down0605.gif" onmouseover ="scroll(1)" onmouseout="scroll(0)" onmousedown="scroll(3)" BORDER= "0" WIDTH ="15" HEIGHT="21" ALT="Pressione o mouse para baixo para acelerar!"></TD>
</TR>
</TABLE>
O código a seguir pode implementar a altura adaptativa do IFrame, ou seja, ele se adapta automaticamente ao comprimento da página para evitar que barras de rolagem apareçam na página e no IFrame ao mesmo tempo.
O código fonte é o seguinte
<script type="text/javascript">
//** o iframe se adapta automaticamente à página**//
//Insira uma lista de nomes de iframes cuja altura você deseja ajustar automaticamente de acordo com a altura da página
//Separe o ID de cada iframe com uma vírgula. Por exemplo: ["myframe1", "myframe2"], só pode haver um formulário, portanto não é necessária vírgula.
//Define o ID do iframe
var iframeids=["test"]
//Se o navegador do usuário não suporta iframe, se deve ocultar o iframe, sim significa oculto, não significa não oculto
var iframehide = "sim"
função dyniframesize()
{
var dyniframe = novo Array()
para (i=0; i<iframeids.length; i++)
{
se (document.getElementById)
{
//Ajusta automaticamente a altura do iframe
dyniframe[dyniframe.length] = document.getElementById(iframeids);
if (dyniframe &&!window.opera)
{
dyniframe.style.display="bloquear"
if (dyniframe.contentDocument && dyniframe.contentDocument.body.offsetHeight) //Se o navegador do usuário for NetScape
dyniframe.height = dyniframe.contentDocument.body.offsetHeight;
else if (dyniframe.Document && dyniframe.Document.body.scrollHeight) //Se o navegador do usuário for IE
dyniframe.height = dyniframe.Document.body.scrollHeight;
}
}
//De acordo com os parâmetros definidos, resolva os problemas de exibição de navegadores que não suportam iframe
if ((document.all || document.getElementById) && iframehide=="não")
{
var tempobj=document.all? document.all[iframeids] : document.getElementById(iframeids)
tempobj.style.display="bloquear"
}
}
}
if (window.addEventListener)
window.addEventListener("carregar", dyniframesize, falso)
senão se (window.attachEvent)
window.attachEvent("onload", dyniframesize)
outro
janela.onload=dyniframesize
</script>
Outras URLs com valor de referência:
http://www.webshu.com/tutorial/tor/7,id=0408.htm //Uso de iframe incorporado em páginas da web
http://www.phpx.com/man/dhtmlcn/objects/IFRAME.html //Objeto IFRAME
http://www.hoyo.idv.tw/web-program/html/iframe.htm //iframe de quadro embutido