Num dos vários trabalho que tive que desenvolver, um dos desafios que se me colocou foi criar uma animação em flash e depois ter vários links a funcionar em cima dessa mesma animação.
O segredo para resolver este problema está no comando css “z-index”…. mas comecemos pelo inicio… aquilo que é necessário é:
Testado em Firefox 3 e Internet Explorer 7
Colocar o código que carrega a animação flash na seguinta div:
- <div id=”flashcontent” style=”Z-Index: -1; POSITION: absolute”>
- <script type=”text/javascript”>
- var so = new SWFObject(“animacao.swf”, “mymovie”, “766″, “200″, “7″, “#336699″);
- so.addParam(“wmode”, “opaque”);
- so.write(“flashcontent”);
- </script>
- </div>
Neste caso o ficheiro swf chama-se animacao e está guardado na mesma pasta em que corre o código. Como podemos verificiar é feita uma chamada ao SWFObject e portanto temos que colocar no inicio do nosso body:
- <script type=”text/javascript” src=”flashobject.js”></script>
Exactamente… estamos a utilizar uma função em javascript… que deverás retirar aqui: Download SWFObject 1.5
Aquilo que estamos a fazer é chamar uma função que devem sacar da net (link em cima) e copiar para o vosso site o ficheiro flashobject.js que é o que vão chamar para carregar a animação em flash.
Como estão a carregar a animação dentro de uma div com z-index = -1 ela ficará atrás do que escreverem em zindex = 0 ou superior, tornando assim possivel sobrepor imagens ou texto…
Simples
Se este Artigo foi útil, comenta ![]()
vlw mesmo.. ajudo muito… abraço
Obrigado pela dica amigo, me ajudou muito.