Los juegos del proyecto AJDA se pueden embeber como iframe (hacer que el juego se muestre en una ventanita) en cualquier lugar que trabaje con código html: blogs, wikis, Moodle, páginas web...

Vamos a poner un ejemplo. Queremos embeber en el blog del proyecto AJDA el juego artificieros, en su versión sin preguntas, en una ventana que tenga una anchura del 100% y una altura de 750 px. La dirección del juego en cuestión es: http://newton.proyectodescartes.org/juegosdidacticos/images/juegos/unzip-juegos/jug-artificieros/contenidos/artificieros-sin-preg.html

 <iframe height="750" src="http://newton.proyectodescartes.org/juegosdidacticos/images/juegos/unzip-juegos/jug-artificieros/contenidos/artificieros-sin-preg.html" width="100%"></iframe>

Normalmente, el ancho del juego es superior al del sitio en el que se quiere embeber y el juego no se ve completo en pantalla, teniendo que usarse las barras de desplazamiento, como se muestra en la siguiente imagen.

Para evitar ésto, se puede hacer un "zoom" sobre el contenido del elemento iframe utilizando las instrucciones de estilo css, que se deben poner al principio del código del documento y que se indican a continuación:

 

<style>

    #wrap { width: 100%; height: 550px; padding: 0; overflow: hidden; }

    #frame { width: 1020px; height: 750px; border: 1px solid black; }

    #frame {

        -ms-zoom: 0.70;

        -moz-transform: scale(0.70);

        -moz-transform-origin: 0 0;

        -o-transform: scale(0.70);

        -o-transform-origin: 0 0;

        -webkit-transform: scale(0.70);

        -webkit-transform-origin: 0 0;

    }

 

El código del iframe debe de quedar de la siguiente forma:

 

<div id="wrap">

La instrucción iframe admite muchos otros parámetros que se pueden consultar en Internet.

Si en lugar de embeber el juego, se quiere enlazar, es suficiente utilizar un hiperenlace, indicando la dirección web en la que se encuentra el juego, y el juego se abrirá en una nueva ventana.