Figuras superpostas


Se você não tem familiaridade com scripts,
consulte a página 05 do Caderninho.

Aplique o texto abaixo antes de </BODY>,
no fim da Origem e informe no local indicado
o endereço das figura e as suas dimensões: height (altura)
e width (largura). Para conhecer as dimensões
de uma figura, abra-a no editor de imagens (Paint, Photo Editor ou outro)e procure
em propriedades ou atributos da figura.
Pode escrever um texto pequeno, uma saudação, uma frase..
Observe então o efeito na aba Visualizar, é lindo!
Para ver o texto, passeie com o mouse sobre a figura.

 

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML><HEAD><TITLE></TITLE>
<META http-equiv=Content-Type content="text/html; charset=iso-8859-1">
<STYLE>BODY {
FONT-SIZE: 14pt; MARGIN-LEFT: 270px; COLOR: #000000; MARGIN-RIGHT: 20px; BACKGROUND-REPEAT: repeat; FONT-FAMILY: "Comic Sans MS"
}
</STYLE>

<META content="MSHTML 5.50.4522.1800" name=GENERATOR></HEAD>
<BODY bgColor=#ffffff background="BACKROUND">
<DIV><FONT face=Arial color=#000080 size=3></FONT>&nbsp;</DIV>
<DIV><FONT face=Arial color=#000080 size=3></FONT><BR></DIV>
<DIV><IMG id=blendpict 
style="FILTER: blendTrans(duration=5); LEFT: 10px; VISIBILITY: hidden; POSITION: absolute; TOP: 10px" 
height=170 src="Endereço da figura 1 no seu computador" width=250>Seu texto aqui; configure a margem esquerda em função da largura da figura.<IMG id=blendpict2 
style="FILTER: blendTrans(duration=5); LEFT: 10px; VISIBILITY: hidden; POSITION: absolute; TOP: 10px" 
src="Endereço da figura 2 no seu computador">
<SCRIPT language=JavaScript>
var bpic1;
var bpic2;

function blendgo() {
bpic1 = blendpict;
bpic1.filters.blendTrans.Apply();
bpic1.style.visibility = "visible";
bpic1.filters.blendTrans.Play();
setTimeout('blendnext()',10000);
}

function blendnext() {
bpic2 = blendpict2;
bpic2.filters.blendTrans.Apply();
bpic2.style.visibility = "visible";
bpic2.filters.blendTrans.Play();
}
setTimeout("blendgo()",2500);

</SCRIPT>
<!-- Aqui é o fundo "falso" - Não mude nada no trecho a seguir --></DIV>
<DIV id=box 
style="Z-INDEX: -1; FILTER: BlendTrans(Duration=0); LEFT: 0px; WIDTH: 800px; POSITION: absolute; TOP: 0px; HEIGHT: 600px"><SPAN 
id=backgroundposition 
style="WIDTH: 3000px; POSITION: absolute; HEIGHT: 4000px"></SPAN></DIV>
<DIV></DIV><BR></BODY></HTML>