El Rock se ha tomado el mundo de los videojuegos y por eso aquí traemos un Juego en Widget que tiene cierto parecido a Guitar Hero o a Rock Band, se llama Rock Out y es muy divertido, usa tu teclado para seguir el ritmo y a Rockear!!
Agregarlo a tu Página Web o Blog simplemente copiando este código en tu Html en la parte que mas desees, si deseas mas información ve a Como Agregar un Widget.
Si te gusta el Fútbol y deseas practicar Tiros Libres este Juego esta hecho para ti, escoges la Dirección, el Efecto y la Fuerza para disparar sobre la barrera y anotar el Gooooool!!
Ya sabes, es muy fácil agregarlo a tu Página Web o Blog simplemente copiando este código en tu Html, si deseas mas información ve a Como Agregar un Widget.
IFrame es una evolución de los marcos rígidos que se usan para dividir páginas <frameset> y <frame>, la diferencia es que con IFrame puedes agregar un marco dentro del contenido de tu página e inclusive sobre el, también veremos como hacerlo aparecer y desaparecer con un Botón.
Iniciemos, el siguiente ejemplo es una muestra básica del uso de esta etiqueta.
Ejemplo:
Código:
<iframe frameborder="1" height="150" src="http://paginaenlazada.html" width="100%">Tu Navegador no soporta esta característica
</iframe>
Importante: frameborder es la propiedad que determina el ancho del borde al rededor de la página, puedes modificar el Heigth y el Width para cambiar el alto y el ancho del marco respectivamente. Ademas lo que pongas entre <iframe> y </iframe> aparecerá en los navegadores que no tienen disponible o no esta activada IFrame, otras propiedades incluyen Scrolling, propiedad que determina el comportamiento de las barras de desplazamiento, la cual puede tener el valor de Auto, Yes y No.
Ahora, el siguiente ejemplo indica como usarlo sobre tu página, para esto recibiremos un poco de ayuda de la etiqueta Div y nos puede servir para hacer algo diferente de las 'alertas' o 'pop-ups' comunes.
Ejemplo:
Lorem ipsum ad his scripta blandit partiendo, eum fastidii accumsan euripidis in, eum liber hendrerit an. Qui ut wisi vocibus suscipiantur, quo dicit ridens inciderint id. Quo mundi lobortis reformidans eu, legimus senserit definiebas an eos. Eu sit tincidunt incorrupte definitionem, vis mutat affert percipit cu, eirmod consectetuer signiferumque eu per. In usu latine equidem dolores. Quo no falli viris intellegam, ut fugit veritus placerat per.
Ius id vidit volumus mandamus, vide veritus democritum te nec, ei eos debet libris consulatu. No mei ferri graeco dicunt, ad cum veri accommodare. Sed at malis omnesque delicata, usu et iusto zzril meliore. Dicunt maiorum eloquentiam cum cu, sit summo dolor essent te. Ne quodsi nusquam legendos has, ea dicit voluptua eloquentiam pro, ad sit quas qualisque. Eos vocibus deserunt quaestio ei.
Como puedes ver la etiqueta Div envuelve a la IFrame, con las propiedades de Posición absoluta y con Top y Left que ubican el div según lo alto y la izquierda respectivamente, lo que le permite estar sobre el texto, y al IFrame le puedes agregar algo de Estilo.
Ahora, si deseas que este aparezca y desaparezca haciendo click en un botón:
Obviamente funciona solo con el nombre o id correcto así: "<div name='pop1' id='pop1'..." con "...document.all.pop1....", creo que el estilo del Div se esta alterado debido a la plantilla del Blogger pero prueben en su página y verán que se ve mucho mas agradable.
Traigo unos increíbles trucos de Javascript que puedes usar en la barra de direcciones, los cuales son muy divertidos, pruébalos copiando los códigos y pegándolos en la barra de direcciones de tu navegador.
Copia esto en tu barra de direcciones y podrás editar la página directamente en tu explorador, sirve sobre cualquier página y no te preocupes los cambios no se guardan, puedes usarlo para jugar bromas cambiando contenidos de noticias para asustar a tus amigos o cosas como esa.
Ya hemos tenido varios Post de widgets de Mascotas Virtuales, como perros, peces inclusive arañas pero no habíamos tenido un gato, pues este widget tiene a un gato llamado Maukie al cual lo puedes molestar un poco.
Pruébalo:
Código:
<script type="text/javascript" src="http://cdn.widgetserver.com/syndication/subscriber/InsertWidget.js"></script><script type="text/javascript">if (WIDGETBOX) WIDGETBOX.renderWidget('7a1ce434-c0c0-4472-a96e-19808d778f11');</script><noscript>Get the <a href="http://www.widgetbox.com/widget/maukie-the-virtual-cat">Maukie - the virtual cat</a> widget and many other <a href="http://www.widgetbox.com/">great free widgets</a> at <a href="http://www.widgetbox.com">Widgetbox</a>! Not seeing a widget? (<a href="http://docs.widgetbox.com/using-widgets/installing-widgets/why-cant-i-see-my-widget/">More info</a>)</noscript>
Ya sabes agrégalo en tu web o blog en la parte que tu desees, copiando este código en tu Html y listo, tienes una nueva mascota virtual.
Quieres unos botones que se sacudan como locos mientras pasas el Mouse por encima de ellos, aquí tengo un pequeño Script que encontré en Javascript.internet.com para que tus botones llamen la atención de tus usuarios con sus inusuales movimientos.
Pruébalos:
Código:
Primero el Script, este puedes colocarlo en cualquier parte, aunque recomiendo que siempre lo coloques en el <HEAD> del documento, aunque hacer esto en un Blog es muy complicado, yo por eso lo agregue directo al inicio de la entrada en el Html y funciona:
Creo que funciona en todos los Navegadores, pero la verdad no estoy seguro, lo importante que debes tener en cuenta es que la función Shake_funct2 ademas del elemento que deseas mover tiene un parámetro numérico que indica el tiempo de espera del movimiento por lo cual entre mayor sea este valor mas lento ira y viceversa .
Hace poco trajimos el Widget para ver los Resultados del Fútbol, esta vez gracias a ESPN Deportes traemos día a día los resultados del mejor Básquetbol del mundo, la NBA, con un Widget en el cual puedes mirar por fecha todos los partidos por venir y resultados de partidos anteriores.
Hoy nos damos el gusto de agregar un Widget de Billar Pool a nuestro Blog, es muy fácil de manejar, solo necesitas el mouse. este juego es traído gracias al ya conocido Absolutist.com.
Como siempre les recuerdo que deben copiar este código en la parte de su web que deseen agregar este juego y que pueden modificar su tamaño con las etiquetas Width para ancho y Heigth para alto, para más información entra Aquí.
Tener tu propio Widget o Gadget es muy útil ya que puede generar mas visitas distribuyendo tus contenidos en otros blogs o páginas web que lo deseen instalar y esto es muy fácil de hacer gracias al servidor de Widgets Widgetbox.com del cual anteriormente ya había traído varios widgets a este Blog.
Lo primero que debes hacer es Entrar y Crear una Cuenta dando click al Botón "Join Now" que se encuentra en la esquina superior derecha, aparece un formulario muy común y sencillo de registro en el cual también puedes enlazar a tu cuenta de Facebook si así lo quieres.
Después debes dirigirte a Make a Widget, en la cual hay varias opciones para crear un Widget de diferentes tipos e inclusive tiene mas opciones para almacenar y servir widgets que previamente hallas realizado, pero esas opciones las exploraremos después, ahora solo vamos a crear un gadget de Blog/Feed.
Una vez des Click en Blog/Feed aparecerá la siguiente ventana, donde debes presionar Click en "Basic", para que sea Gratis :), e ingresar la dirección de tu Blog y por ultimo presionar el Botón "Make Widget".
En ese momento te aparece una pantalla con varias opciones modificables, entre las cuales se encuentras las opciones Gratuitas que mostramos a continuación.
Otras opciones que puedes modificar son Edit Gallery Details que son los titulos y tags por los cuales te pueden encontrar en el buscador interno de Widgetbox.
Para finalizar no olvides Activar la casilla de "I have read and agree to the terms of the Developer Agreement, including the Content Guidelines" y presionar Save Blidget.
Si hiciste todos los pasos bien ahí ya se encuentra en el servidor listo para ser instalado en cualquier página web, ahora necesitamos el código para publicarlo, por lo cual damos click en "Get Widget" y aparece una ventana en la cual debes copiar el "Embed Code" y listo, aquí tengo el ejemplo de este Blog.
Pruébalo:
Código:
<script type="text/javascript" src="http://cdn.widgetserver.com/syndication/subscriber/InsertWidget.js"></script><script type="text/javascript">if (WIDGETBOX) WIDGETBOX.renderWidget('2042bdeb-8028-47a9-89c0-3676b2151fd6');</script><noscript>Get the <a href="http://www.widgetbox.com/widget/w3-tricks-tu-sitio-de-trucos-web">W3 Tricks - Tu Sitio de Trucos Web</a> widget and many other <a href="http://www.widgetbox.com/">great free widgets</a> at <a href="http://www.widgetbox.com">Widgetbox</a>! Not seeing a widget? (<a href="http://docs.widgetbox.com/using-widgets/installing-widgets/why-cant-i-see-my-widget/">More info</a>)</noscript>
Unos últimos datos mas antes de terminar, puedes crear mas de un widget y los puedes ver todos con la cantidad de visitas e instalaciones entrando en Widgetbox.com y dando click en la barra Your Widgets.
No olvides agregar el código en tu web si deseas compartirlo, y si deseas aparecer aquí con tus widgets en W3 Tricks puedes comentar aquí o en la pagina de facebook.
Este es uno de los Gadgets de mascotas que mas a llamado mi atención, se trata de un Perro al cual le puedes Lanzar un Hueso, Dar Comida, Lanzar una Pelota, y Llamarlo para ordenarle que se siente o que se acueste o dejarlo solo para que descanse o haga cualquier otra cosa, es tridimensional, pero a pesar de esto no es nada lento.
