Usamos cookies para medir audiência e melhorar sua experiência. Você pode aceitar ou recusar a qualquer momento. Veja sobre o iMasters.
Alinhando o SWF no HTML com CSS
Olá amigo ou amiga que deseja alinhar seu flash na sua página! Esse tutorial foi feito pra você!
Esse tutorial é mais sobre CSS do que Flash, mas tá valendo.
1. Nomeando seu flash adequadamente. Primeiro você tem que nomear seu swf de forma que possa ser reconhecido pelo CSS. Esse passo consiste em apenas definir o argumento id do seu flash. Se você estiver inserindo por <object> é só acrescentar id="flash" na tag, do lado de width, por exemplo. Se estiver usando algum script em javascript (para burlar o IE) procure saber como nomear o id, mas geralmente esses scripts já colocam um nome.
2. Inserindo o CSS Agora vamos simplesmente construir o CSS para alinhar. Coloque dentro de <head> </head>:
<style type="text/css">body{ margin: 0px;}#flash { position: absolute; margin-top: -200px; margin-left: -300px; top: 50%; left: 50%;}</style>Nesse CSS a margem do body é zerada e o flash (com o id="flash" no exemplo) é alinhado no centro. Mas como?
Repare no atributo margin. Ele é negativo e corresponde a metade do tamanho do seu swf. Nesse caso o swf teria 400px de altura por 600px de largura. Ao colocarmos a margem como a sua metade, estamos definindo um ponto bem no centro do swf, e é esse ponto que vai ficar em 50% x 50%.
Só isso. Testando sua página seu swf estará centralizado. Se ver algum erro certifique-se de que o id do flash é o mesmo que está no CSS. http://forum.imasters.com.br/public/style_emoticons/default/thumbsup.gif
Abraço galera!
Carregando comentários...