Está en la página 1de 2

Leandonos Blog - Centrar una pelcula mediante CSS, usando SWFObject http://www.leandrodonofrio.com/tutoriales/flash/centrar-una-pelicula-f...

Leandonos Blog
Recursos web, diseo, tutoriales, opinin, algunas noticias... Inicio Inicio Blog Recursos Web Tutoriales Site Map Sobre mi... buscar... Tutoriales Centrar una pelcula mediante CSS, usando SWFObject

Suscribirse por feed

Centrar una pelcula mediante CSS, usando SWFObject


martes, 22 de agosto de 2006

Categoras
Articulos

Tal vez tu seas alguien que para centrar un SWF en una web, utiliza los porcentajes (ejemplo: width = 80%, height = 80%) El mtodo no es malo: al ser porcentual el tamao del swf, ste se adaptar a los distintos tamaos de pantallas. Sin embargo posee sus contras: Si poseemos mapas de bits, al agrandar la pelcula, las imgenes se vern pixeladas; Cuanto ms grande es el escenario, ms trabajo tendr el Flash Player para renderizar la pelcula. Si poseemos otros elementos fuera del escenario,tambin se mostraran.

Suscribirse por e-mail


Tu direccin de correo

Diseo Fuentes Herramientas Iconos

Suscribirme!

Imgenes Joomla!

Lo ms leido [ Top 15 ]
Descargar fuentes gratuitas: 42 sitios para hacerlo Cmo crear un template para Joomla! (Primera parte) Disear a lo Web 2.0, la lista definitiva Templates gratuitos Cmo crear un template para Joomla! (Segunda parte) Aprende Photoshop a travs de YouTube Crear un stencil desde cero y no morir en el intento I

Opinin Programas Recomendados Scripts Web

Por lo tanto, muchas veces, es mejor tener una pelcula con un tamao fijo, el cual sea perfectamente visible con distintos tamaos de pantallas. Y es justamente eso lo que voy a mostrar utilizando CSS y SWFObject , con la ayuda de dos excelentes tutoriales: El de DaHouseCat : SWFObject Script anti-EOLAS y; El de Code4net : Alineamiento vertical .

Blogs Recomendados
Codigo Geek DaHouseCat Delirius Intenta NosoloCodigo PuntoGeek Que la pases lindo! SigT Therror Webmaster Libre Xyberneticos

En el ejemplo se utilizar una pelcula de 720 px de ancho por 400 px de largo. Una vez exportado el documento HTML, lo abrimos con un editor y entre <head> y </head> ponemos...

Haz que tu Windows XP luzca muy Firefox Layouts gratuitos: Listado de sitios Art Attack Cmo crear un template para Joomla! (Tercera parte) Aadir notas en imgenes (similar a Flickr) utilizando CSS Tutorial para crear un pop-up en Flash - Version 2.0 Crear un stencil desde cero y no morir en el intento II Tutorial: Crear un template para Joomla! 1.5 (Primera parte)

<!--SWFObject--> <script type="text/javascript" src="swfobject.js"></script> <!--CSS--> <style type="text/css"> <!-#centrar { margin-top: -225px; margin-left: -360px; position: absolute; top: 50%; left: 50%; width: 720px; height: 450px; } --> </style>
Entre <body> y </body> reemplazamos todo el contenido entre las etiquetas <object> y </object> por:

Artculos Aleatorios
Vecteezy: Directorio de diseos vectoriales gratuitos Clean CSS, reduciendo el peso de los CSS de manera online Web Application Icons Set Texture King: Texturas de calidad gratis Slideroll: Crea SlideShows online fcilmente

Sitios Recomendados
Minijuegos Anuncios Catering Artesanal

<div id="centrar"> Texto de reemplazo en caso de no existir la pelicula SWFObject </div> <script type="text/javascript"> var so = new SWFObject("pelicula.swf", "pelicula", "720", "450", "7", "#FFFFFF"); so.write("centrar"); </script>
De esta forma tendremos la pelcula centrada, con un tamao fijo para todas las resoluciones, sin que se muestren elementos que tengamos fuera del escenario y adems sin problemas con Internet Explorer y Opera 9.0 Ejemplo creado Descargar ejemplo

Portal de Internet e Informtica Tercerclick vuelos baratos Cursos Comparacin de precios Hoteles Gestion Documental Directorio de empresas Mietwagen hosting multidominio Driver Ok enviar flores a domicilio

1 de 2

23/05/2008 01:25 p.m.

Leandonos Blog - Centrar una pelcula mediante CSS, usando SWFObject http://www.leandrodonofrio.com/tutoriales/flash/centrar-una-pelicula-f...

Tags: tutorial flash

Comentarios (2)
1 Escrito por Rogelio, el 09-01-2008 15:12 Bastante bien explicado, yo no habia entendido como se usaba el SWFObject y nadie me despejaba la duda, con ste tutorial lo hice en 2 o 3 minutos, excelentisimo, gracias 2 Escrito por Jon, el 07-02-2008 12:27 No funciona al intentar centrar 2 archivos swf. Aparecen duplicados

Por favor, mantenga el tpico de los mensajes en relevancia con el tema del artculo. Lenguaje inapropiado ser borrado.

Nombre: E-mail: Sitio Web: Comentario:

Cdigo:*

Enviar

< Anterior

Siguiente > [Volver]


Leandonos Blog funciona bajo Joomla! [ Todos los crditos ] Los textos se rigen bajo licencia Creative Commons

2 de 2

23/05/2008 01:25 p.m.