Ayer incluí en mi plantilla una ventana modal propia en el blog, denominada modal box, que vi de pura casualidad y bendita eventualidad, en el blog de Emilio Cobos, para más información detallada sobre este artilugio, dirigiros al enlace anterior. Por mi parte voy a pasaros unas demostraciones y el código para poder insertar está magnífica ventana modal en vuestro blog, que nos brinda Emilio. Ahora vayamos a la tarea que nos concierne. Primero viene el Script, el CSS y luego el Html. Y finalmente junto al Html, podrás ver las demostraciones de cada una.
Añade el siguiente script antes de </body>:
<script src='http://dl.dropbox.com/u/71679931/share/modalBox.min.js' type='text/javascript'/>
<script type='text/javascript'>
modalBox.init('a','^modalBox')
</script>
Añade el siguiente CSS antes de </b:skin>:
Copiar archivo CSS!
Varios ejemplos de ventanas modales y el Html:
Vídeos de Youtube
<a href="http://www.youtube.com/watch?v=DuFUtL8zUAk" rel="modalBox">Click para verlo!</a>
Click para verlo!
Vídeos de Vimeo
<a href="http://vimeo.com/66604119" rel="modalBox">Click para verlo!</a>
Click para verlo!
Ejemplo Iframe
<a href="http://css-tricks.com/?iframe=true&width=70%&height=90%" rel="modalBox">Click para verlo</a>
Click para verlo!
Eso es todo, amigos espero que os guste está ventana modal, para vuestro blog o web, si tenéis alguna duda comentar, sois bienvenidos, responderé con la mayor brevedad posible. Sí deseáis, no os olvidéis de hacer clic en los banners de publicidad, es la única manera de agradecer y contribuir económicamente, para sostener está pagina web. Gracias por su colaboración. Enjoy this tip!
Get free premium widgets for your blog and website.
Puzzle Bobble
Karate Blazers
Puzzle De Bloques
Magical Cat Adventure